注冊登錄

微信小程序怎么做 用戶點擊按鈕生成二維碼

2021-07-01
導讀:微信小程序怎么做已經(jīng)是當下最熱門的話題,下面將從多方面來談?wù)動脩酎c擊按鈕生成二維碼 相關(guān)的內(nèi)容。...

微信小程序怎么做已經(jīng)是當下最熱門的話題,下面將從多方面來談?wù)動脩酎c擊按鈕生成二維碼 相關(guān)的內(nèi)容。

目標: 
請求二維碼并展示 
步驟: 
用戶點擊按鈕生成二維碼 
步驟: 
1、微信小程序往后臺請求二維碼 
2、后臺(java/php) 根據(jù)微信小程序信息往微信端請求tonken 
3、后臺得到tonken后往微信端請求二維碼圖片 
4、后臺得到圖片后保存在服務(wù)器上,將路徑返回給微信小程序 
5、微信小程序得到路徑后,根據(jù)路徑下載圖片 
6、下載圖片成功后再保存至本地 
7、保存成功后將路徑給予image標簽里面展示
代碼: 
wxml

微信小程序怎么做 用戶點擊按鈕生成二維碼

 

<image class="scanimg" src="{{filePath}}" bindtap="getAgain"></image>

<button type="primary" bindtap="primary">點擊生成二維碼</button>

 

s代碼

 

primary:function (e) {

var _url = '后臺地址';

  wx.request({

    url: _url,

//請求報文體

    data: [{

      id: agentCode

    }],

    method: 'POST',

    header: {

      'content-type': 'application/json'

    },

    success: function (res) {

//為00時表示成功,得到二維碼的地址

      if (res.data.code == '00') {

        console.log("成功")

//下載二維碼

        wx.downloadFile({

          url: res.data.body[0].URL,

          success: function (res) {

//如果二維碼中的id為固定值可以將圖片保存到本地,否則不用保存

            wx.saveFile({

              tempFilePath: res.tempFilePath,

              success: function (res) {

                console.log("保存成功")

_that.setData({

filePath: res.savedFilePath

})

console.log(res.savedFilePath)

try {

//id為定值,則將保存的地址存入緩存,非定值則只需要setData就行

wx.setStorageSync('filePath', res.savedFilePath)

} catch (e) {

console.log(e)

}

              },

              fail: function (res) {

                console.log("保存失敗")

                console.log(res)

              }

            })

          }, fail: function (res) {

            util.msg("錯誤", "通訊失敗")

            console.log(res)

          }

        })

      } else {

        console.log("錯誤")

        util.msg("錯誤", res.data.msg)

      }

    },

    fail: function () {

      util.msg("錯誤", "通訊失敗")

      console.log(res)

    }

  })

}

 

java端代碼

 

// 訪問微信后臺的URL

String URL = systemConfig.getString("LoginOrRegisterUrl");

// 請求類型

String grant_type = systemConfig.getString("grant_type");

// 第三方用戶唯一憑證密鑰

String secret = systemConfig.getString("secret");

// 第三方用戶唯一憑證

String appId = systemConfig.getString("appid");

// 請求token時用到的URL

String tokenUrl = systemConfig.getString("tokenUrl");

// 向微信后臺請求獲取token

                        String sendGet = HttpClientConnectionManager.sendGet(

                                tokenUrl, "grant_type=" + grant_type

                                        + "&secret=" + secret + "&appid="

                                        + appId + "");

                        System.out.println(sendGet);

                        JSONObject json = JSONObject.fromObject(sendGet);

                        access_token = json.get("access_token").toString();

                        if (access_token == null) {

//沒有token 則返回錯誤碼和錯誤信息

                            agentDTO.setCode("0002");

                            agentDTO.setDesc("獲取tokenId失敗");

                            return agentDTO;

                        }

System.out.println(access_token);

// 訪問微信后臺帶的json參數(shù)

                    Map<String, Object> map = new HashMap<String, Object>();

                    map.put("path", "pages/register");//你二維碼中跳向的地址

                    map.put("width", "430");//圖片大小

                    JSONObject json = JSONObject.fromObject(map);

                    HttpClientConnectionManager.httpPostWithJSON(URL

                            + access_token, json.toString(), id + "max");

                    // 返回給前端的后臺服務(wù)器文件讀取路徑

                    String downloadUrl = systemConfig

                            .getString("agentImgDownloadUrl")

                            + id

                            + "max"

                            + "/";

                    // 返回給前端的后臺服務(wù)器文件下載路徑

                    String downloadfileUrl = downloadUrl + id + "max" + ".jpg";

                    agentResView.setURL(downloadfileUrl);

                    agentDTO.setAgentResView(agentResView);

agentDTO.setCode("00");

agentDTO.setDesc("成功");

                        return agentDTO;

 

tip 
1、這是申請一張二維碼的代碼,申請多張可以用for或者其他的方法 
2、當id為定量時,每次點擊按鈕判斷filePath緩存是否存在,存在則直接取值展示,不存在則向后臺請求二維碼 

 


重磅推薦:小程序開店目錄

第一部分:小商店是什么

第二部分:如何開通一個小商店

第三部分:如何登錄小商店

第四部分:開店任務(wù)常見問題

第五部分:小商店可以賣什么

第六部分:HiShop小程序特色功能

第七部分:小程序直播

第八部分:小程序收貨/物流

第九部分:小程序怎么結(jié)算

第十部分:小程序客服

第十一部分:電商創(chuàng)業(yè)

第十二部分:小程序游戲開發(fā)

電話咨詢 微信咨詢 預(yù)約演示 0元開店