调微信接口上传图片

步骤一:引入JS文件

在需要调用JS接口的页面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.0.0.js

步骤二:通过config接口注入权限验证配置

所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用

var sCurrURL = location.href.split(‘#‘)[0];
var myurl = getRootPath() + "zs/wechat/getJsSdkconfig?url="+sCurrURL;
$.axpost(myurl, null, function(data){
		var timestamp = data.respMap.timestamp;
	var noncestr = data.respMap.noncestr;
	var appId = data.respMap.appId;
	var signature = data.respMap.signature;
	wx.config({
	    //debug: true,
	    // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
	    appId: appId, // 必填,企业号的唯一标识,此处填写企业号corpid
	    timestamp:timestamp , // 必填,生成签名的时间戳
	    nonceStr: noncestr, // 必填,生成签名的随机串
	    signature: signature,// 必填,签名,见附录1
	    jsApiList: [‘chooseImage‘,‘uploadImage‘] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
	});
})

  

步骤三:选取与上传图片

$(‘#cardFront‘).click(function() {
	upImg($(‘#front‘));
});
$(‘#cardBack‘).click(function() {
	upImg($(‘#back‘));
})
function upImg(obj){
	wx.chooseImage({
		count: 1,
		// 默认9
		sizeType: [‘original‘, ‘compressed‘],
		// 可以指定是原图还是压缩图,默认二者都有
		sourceType: [‘album‘, ‘camera‘],
		// 可以指定来源是相册还是相机,默认二者都有
		success: function(res) {
			var localIds = res["localIds"]; // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
			if (1 === localIds.length) {
				var localId = localIds[0];
				wx.uploadImage({
					localId: localId,
					// 需要上传的图片的本地ID,由chooseImage接口获得
					isShowProgressTips: 1,
					// 默认为1,显示进度提示
					success: function(res) {
						var serverId = res.serverId; // 返回图片的服务器端ID
						var url = getRootPath() + "/zs/wechat/uploadImg?mediaId=" + serverId + getUrlEnd();
						$.axpost(url, null,
						function(data) {
							var picturePath = data.respData.picturePath;
							obj.attr(‘src‘, picturePath);
						})
					}
				});
			};
		}
	});
}

  

时间: 2024-09-29 09:07:43

调微信接口上传图片的相关文章

通过微信接口上传图片到本地服务器

1 /*{ 2 HTTP/1.1 200 OK 3 Connection: close 4 Content-Type: image/jpeg 5 Content-disposition: attachment; filename="MEDIA_ID.jpg" 6 Date: Sun, 06 Jan 2013 10:20:18 GMT 7 Cache-Control: no-cache, must-revalidate 8 Content-Length: 339721 9 10 Xxxx

java微信接口开发java SpringMVC mybatis 后台框架 集成代码生成器开发利器

获取[下载地址]   QQ: 313596790   [免费支持更新]支持三大数据库 mysql  oracle  sqlsever   更专业.更强悍.适合不同用户群体[新录针对本系统的视频教程,手把手教开发一个模块,快速掌握本系统]A 代码生成器(开发利器);      增删改查的处理类,service层,mybatis的xml,SQL( mysql   和oracle)脚本,   jsp页面 都生成   就不用写搬砖的代码了,生成的放到项目里,可以直接运行B 阿里巴巴数据库连接池druid

java 微信自定义菜单 java微信接口开发 公众平台 SSM redis shiro 多数据源

获取[下载地址]   QQ: 313596790官网 http://www.fhadmin.org/A 调用摄像头拍照,自定义裁剪编辑头像,头像图片色度调节B 集成代码生成器 [正反双向](单表.主表.明细表.树形表,快速开发利器)+快速表单构建器 freemaker模版技术 ,0个代码不用写,生成完整的一个模块,带页面.建表sql脚本,处理类,service等完整模块C 集成阿里巴巴数据库连接池druid  数据库连接池  阿里巴巴的 druid.Druid在监控.可扩展性.稳定性和性能方面都

微信接口图文消息群发,预览

上来就直接贴代码了,具体问题放到最后说,这个类我将方法全都封装在里面了,基本上拿去修改一下就可以用了 using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Text.RegularExpressions;using Newtonsoft.Json;using System.Web.SessionState;using Website_CS;using mgtArt

微信接口校验

1.Servlet package com.itmayiedu.servlet; import java.io.IOException;import java.io.PrintWriter;import java.util.Date;import java.util.Map; import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.Http

ecshop微信接口基础认识

ecshop微信接口基础认识,当你要学习ecshop和微信整合的时候,你就必须研究ecshop的数据结构对接以及微信数据接口的基本知识.我们知道微信其实就是通过有效的消息推送,用JSON格式的数据或者是XML格式的数据,推送到你的api上面去显示,其实就是一段XML内容.消息推送的话. ecshop和微信对接的基础接口,就是只是包含简单的消息推送接口,以及操作界面的界面定义接口,其他相关关注接口.都需要开通高级接口,论证接口才能做.发送任何消息之前,必须获取token以及验证access_tok

Force.com - 微信接口后台开发与配置

为寻找国内免费云资源作为微信后台,花了一天时间试用SinaAppEngine(SAE),调试太不方便用户体验差.新浪作为媒体公司技术功底经不起考验,亚马逊能推出AWS,新浪还不行!更好选项是百度BaiduAppEngine(BAE),但最近尽然开始收费,还是安心回到force.com,至少老外承诺免费的东西一直免费且可靠. 第一步,申请force.com账号,请至developer.force.com申请,如是www.salesforce.com申请下来的是作为客户的账号,不适合开发人员:第二步

微信接口开发之前准备工作

我是一名.net码农,最近项目需要用到微信接口开发,苦于微信官方没有.net示例,个人表示非常无解微信竟然这么无视.net的存在(让我哭会) .难道做为.net就不能开发好微信接口了吗?反问了一下,上网查了查资料,答案是否定的,也有许多大神提供很好的例子.在这里谢谢各位前辈的辛苦了(膜拜).在此,我也开始踏入了微信接口开发的工作中了,也想学习大神们的无私,特此在这里共享出我的点点滴滴,与码友一同成长. 先说说我的开发前准备吧! 1.申请注册一个公众平台(哈哈,这是必须的),如果你想要有更大更厉害

java微信接口之四—上传素材

一.微信上传素材接口简介 1.请求:该请求是使用post提交地址为: https://api.weixin.qq.com/cgi-bin/media/uploadnews?access_token=ACCESS_TOKEN 其中ACCESS_TOKEN是我们动态获取的. 发送的数据: {"articles":[ { "thumb_media_id":"qI6_Ze_6PtV7svjolgs-rN6stStuHIjs9_DidOHaj0Q-mwvBelOXC