首先獲取微信簽名,Controller代碼: public ActionResult MutualHelpAdd() { var jssdkUiPackage = JSSDKHelper.GetJsSdkUiPackage(WeChatParameter._appID, WeChatParamete ...
首先獲取微信簽名,Controller代碼:
public ActionResult MutualHelpAdd() { var jssdkUiPackage = JSSDKHelper.GetJsSdkUiPackage(WeChatParameter._appID, WeChatParameter._appSecret, Request.Url.AbsoluteUri); ViewBag.AppId = WeChatParameter._appID; ViewBag.Timestamp = jssdkUiPackage.Timestamp; ViewBag.NonceStr = jssdkUiPackage.NonceStr; ViewBag.Signature = jssdkUiPackage.Signature; return View(); }View Code
視圖代碼:
wx.config({ //debug: true, appId: '@ViewBag.AppId', timestamp: '@ViewBag.Timestamp', nonceStr: '@ViewBag.NonceStr', signature: '@ViewBag.Signature', jsApiList: [ 'chooseImage', 'previewImage', 'uploadImage', 'downloadImage' ] }); wx.ready(function () { // 5 圖片介面 // 5.1 拍照、本地選圖 var images = { localId: [], serverId: [] }; document.querySelector('#btnAddImage').onclick = function () { wx.chooseImage({ count: 3, // 預設9,設置可以同時上傳的圖片數量 sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖,預設二者都有 sourceType: ['album', 'camera'], // 可以指定來源是相冊還是相機,預設二者都有 success: function (res) { images.localId = res.localIds; //alert('已選擇 ' + res.localIds.length + ' 張圖片'); var i = 0, length = images.localId.length; images.serverId = []; function upload() { wx.uploadImage({ localId: images.localId[i], success: function (res) { i++; //alert('已上傳:' + i + '/' + length); images.serverId.push(res.serverId); //TODO: res.serverId 就是 media_id,根據它去微信伺服器讀取圖片數據:自定義上傳到自己伺服器 var imageJson = $("#hdImageJson").val(); $.ajax({ type: 'post', url: '/Common/AddImage', async: false, data: { media_id: res.serverId, imageJson: imageJson, folderName:"MutualHelp" }, success: function (data) { if (data.ImageUrl != '') { // 返回 圖片在我們自己的伺服器的url var img = "<img class='task_image' src='/images/" + data.ImageUrl + "'/>"; $("#imgList").append(img); $("#hdImageJson").val(data.ImageJson); } }, error: function (err) { } }) if (i < length) { upload(); } }, fail: function (res) { alert(JSON.stringify(res)); } }); } upload(); } }); }; });View Code
圖片保存到本地伺服器方法:
/// <summary> /// 公用 微信 上傳圖片方法 /// </summary> /// <param name="media_id"></param> /// <param name="imageJson"></param> /// <returns></returns> public JsonResult AddImage(string media_id, string imageJson,string folderName) { var imgUrl = ""; try { List<ImageList> curImageResult; if (!string.IsNullOrEmpty(imageJson)) { curImageResult = JsonConvert.DeserializeObject<List<ImageList>>(imageJson); } else { curImageResult = new List<ImageList>(); } var accessToken = AccessTokenContainer.TryGetAccessToken(WeChatParameter._appID, WeChatParameter._appSecret); System.IO.MemoryStream stream = new System.IO.MemoryStream(); MediaApi.Get(accessToken, media_id, stream); Image img = Image.FromStream(stream); var imgName = DateTime.Now.ToString("yyyyMMddhhss"); var fileSaveUrl =string.Format(FilePath + "/{0}/" + imgName + ".jpg", folderName); imgUrl = string.Format("/{0}/" + imgName + ".jpg", folderName); img.Save(fileSaveUrl); var imageEntity = new ImageList { ImageKey = imgName, ImageUrl = imgUrl, UploadTime = DateTime.Now }; curImageResult.Add(imageEntity); imageJson = JsonConvert.SerializeObject(curImageResult); } catch (Exception ex) { imgUrl = ""; } var result = new { ImageJson = imageJson, ImageUrl = imgUrl }; return Json(result); }View Code