欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

微信上传图片,图片对到本地

程序员文章站 2022-07-14 20:52:21
...

 

1、获取公众号的全局唯一票据

      接口调用请求说明

http请求方式: GET
https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET

2、用第一步获取access_token采用http get方式请求获得jsapi_ticket

http请求方式: GET
https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi

3、获取签名,jsapi_ticket(第二步获取)、noncestr(生成签名的随机串)、timestamp(生成签名的时时间戳)、url(当前访问的URL)

 

4、把获取的 sign、appId、noncestr、timestamp 传到页面

 

5、页面JavaScript显示:

     wx.config({

            debug: false,

            appId: "<%=request.getAttribute("appId")%>", 

            timestamp: "<%=request.getAttribute("timestamp")%>", 

            nonceStr: "<%=request.getAttribute("noncestr")%>", 

            signature: "<%=request.getAttribute("sign")%>",

            jsApiList: ["chooseImage","uploadImage"

 

      });

 

 

      wx.error(function(res){

          alert("error");

 

       });

 

        wx.ready(function(){

 

            document.querySelector('#chooseImage').onclick = function(){

 

                 wx.chooseImage({

                       success: function (res) {

                             var uploadSrc = res.localIds.toString(); 

                              $("#faceImg").attr("src", downSrc);//显示图片到页面上

                             wx.uploadImage({//上传到微信服务器上

                                      localId: uploadSrc,

                                      success: function (res) {

                                          var resultVal = res.serverId;

                                          $("#faceImgEncode").val(resultVal);//保存微信资源ID,到服务端准备下载

 

                                       },

                                       fail: function (res) {

                                              alert(JSON.stringify(res));

                                       }

                               });

                           }

                     });

                 };

 

          });

 

6、页面显示:

 

<pclass="img"id="chooseImage"><imgid="faceImg"src="123.jpg"/></p>

 

<inputtype="hidden"id="faceImgEncode"/>

 

7、后台处理图片,把资源文件对到本地服务。

 

http://file.api.weixin.qq.com/cgi-bin/media/get?access_token=token&media_id=页面获取ID