一、微信公众号图片上传_base64图片上传处理
使用到的接口拍照、选择相册接口; 读取本体图片接口
1.拍照或从手机相册中选图接口
wx.chooseImage({count: 1, // 默认9sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有success: function (res) {var localIds = res.localIds; // 返回选定照片的本地 ID 列表,localId可以作为 img 标签的 src 属性显示图片}
});
2.获取本地图片接口
wx.getLocalImgData({localId: '', // 图片的localIDsuccess: function (res) {var localData = res.localData; // localData是图片的base64数据,可以用 img 标签显示}
});
二、前端处理
var isWechat = false;//判断是否是微信浏览器绑定//获取js配置权限$.get('http://xxx/common/GetJsConfig', {url: encodeURIComponent(location.href)}, function (res) {wx.config({debug: false, // 开启调试模式,调用的所有 api 的返回值会在客户端 alert 出来,若要查看传入的参数,可以在 pc 端打开,参数信息会通过 log 打出,仅在 pc 端时才会打印。appId: res.appId, // 必填,公众号的唯一标识timestamp: res.timestamp,// 必填,生成签名的时间戳nonceStr: res.nonceStr, // 必填,生成签名的随机串signature: res.signature,// 必填,签名jsApiList: ['chooseImage', 'getLocalImgData'] // 必填,需要使用的 JS 接口列表});});wx.ready(function () {//config验证成功// alert('配置结束');isWechat = true;});window.onload = function () {setTimeout(() => {if (isWechat) {//微信浏览器绑定处理wxUpload();}else {commonUpload();}}, 1000);}
微信浏览器上传图片
//微信上传function wxUpload() {$('#uploadBtn1').click(function () {//选择图片wx.chooseImage({count: 1, // 默认9sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有success: function (res) {var localIds = res.localIds; // 返回选定照片的本地 ID 列表,localId可以作为 img 标签的 src 属性显示图片// alert(localIds);//获取图片base64数据wx.getLocalImgData({localId: localIds[0], // 图片的localIDsuccess: function (res) {var localData = res.localData; // localData是图片的base64数据,可以用 img 标签显示// alert('图片数据:'+localData);//上传图片,返回图片相对地址$.post('http://xxxxx/mall/SaveBase64', {imgdata: localData}, function (data) {if (data.relativeName) {var link = "http://xxxxx" + data.relativeName;}else {alert(data.msg);}});}});}});});}

三、后台端处理
//上传base64图片public IActionResult SaveBase64(){try{//imgdata = SecurityHelper.HTMLDecode(imgdata);string imgdata = this.HttpContext.Request.Form["imgdata"];if (imgdata.Contains("base64")){imgdata = imgdata.Split(",")[1];}// LogHelper.Write(imgdata);byte[] byteData = Convert.FromBase64String(imgdata);MemoryStream ms = new MemoryStream();ms.Write(byteData, 0, byteData.Length);Image img = Image.FromStream(ms);string path = UploadHandle.ServerInfo.SitePath + "/upload/base64/";if (Directory.Exists(path) == false)Directory.CreateDirectory(path);string filename=Guid.NewGuid().ToString() + ".jpg";path += filename;string relativeName = "/upload/base64/" + filename;img.Save( path, ImageFormat.Jpeg);img.Dispose();return Json(new{relativeName});}catch (Exception ex){return Error(ex);}}
特别问题注意:
1.Android系统的微信获取的图片base64位的字符串内容,没有 image/jpeg;base64
2.IOS 系统的微信获取的图片base64数据,含有 image/jpeg;base64
更多:















