通過JS-SDK進行操作的基本步驟包括：引用微信的JS、配置權限驗證參數及使用的接口、通過ready及error驗證配置及功能接口的使用等。如下以上傳圖片Demo為例進行說
（1）引入JS及配置調用參數

<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script type="text/javascript">
        wx.config({
            debug: false, // 開啟調試模式,調用的所有api的返回值會在客戶端alert出來，若要查看傳入的參數，可以在pc端打開，參數信息會通過log打出，僅在pc端時才會打印。
            appId: '@CommonOperate.GetJsSdkUiPackage().AppId', // 必填，公眾號的唯一標識
            timestamp: @CommonOperate.GetJsSdkUiPackage().Timestamp, // 必填，生成簽名的時間戳
            nonceStr: '@CommonOperate.GetJsSdkUiPackage().NonceStr', // 必填，生成簽名的隨機串
            signature: '@CommonOperate.GetJsSdkUiPackage().Signature', // 必填，簽名
            jsApiList: [ //必填，需要使用的JS接口列表，所有JS接口列表見附錄2
                'checkJsApi',
                'chooseImage',
                'previewImage',
                'uploadImage',
                'downloadImage',
                'getLocation',
                'openLocation'
            ] 
        });

　　

（2）通過chooseImage選取多張照片，選取成功后可獲得本地照片的ID集“res.localIds”

（3）點擊上傳時遍歷“res.localIds”分別調用uploadImage



可獲取“varserverId=res.serverId;”，此serverId對應存儲在微信平臺里的唯一資源mediaId，將mediaIdPOST到后端可通過微信的接口獲取photostream再保存到本地或上傳到cloud


注意：如下需將流的當前位置設置為0 stream.Position = 0;（否則會導致上傳到Azure等時會出現打不開的情況）

/// <summary>
/// 上傳微信照片
/// </summary>
/// <param name="repairId"></param>
/// <param name="mediaId"></param>
/// <returns></returns>
[HttpPost]
public JsonResult UploadWxImage(int repairId, string mediaId)
{
	using (MemoryStream stream = new MemoryStream())
	{
		CommonOperate.GetMedia(mediaId, stream);
		stream.Position = 0;
		string localPath = Server.MapPath($"~/Content/{Guid.NewGuid()}.jpg");
		try
		{
			System.Drawing.Image imgLocal = System.Drawing.Image.FromStream(stream);
			imgLocal.Save(localPath);
		}

　　

參考：

JS-SDK
https://work.weixin.qq.com/api/doc

總結

以上是生活随笔為你收集整理的微信JS-SDK上传多张照片的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。