微信小程式使用者點擊按鈕產生帶參二維碼的範例程式碼
目標:
請求二維碼並展示
步驟:
使用者點選按鈕產生二維碼
步驟:
1、微信小程式到後台請求二維碼
2、後台(java/php) 依照微信小程式資訊往微信端請求tonken
3、後台得到tonken後往微信端請求二維碼圖片
4、後台得到圖片後保存在伺服器上,將路徑回傳給微信小程式
5、微信小程式得到路徑後,依照路徑下載圖片
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参数 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"); // 返回给前端的后台服务器文件读取路径 String downloadUrl = systemConfig .getString("agentImgDownloadUrl") + id + "max" + "/"; // 返回给前端的后台服务器文件下载路径 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快取是否存在,存在則直接取值展示,不存在則向後台請求二維碼
以上是微信小程式使用者點擊按鈕產生帶參二維碼的範例程式碼的詳細內容。更多資訊請關注PHP中文網其他相關文章!

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

AI Hentai Generator
免費產生 AI 無盡。

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

熱門話題

閒魚官方微信小程式悄悄上線,在小程式中可以發布閒置與買家/賣家私訊交流、查看個人資料及訂單、搜尋物品等,有用好奇閒魚微信小程式叫什麼,現在快來看一下。閒魚微信小程式叫什麼答案:閒魚,閒置交易二手買賣估價回收。 1、在小程式中可以發布閒置、與買家/賣家私訊交流、查看個人資料及訂單、搜尋指定物品等功能;2、在小程式的頁面中有首頁、附近、發閒置、訊息、我的5項功能;3、想要使用的話必要要開通微信支付才可以購買;

微信小程式實現圖片上傳功能隨著行動網路的發展,微信小程式已經成為了人們生活中不可或缺的一部分。微信小程式不僅提供了豐富的應用場景,還支援開發者自訂功能,其中包括圖片上傳功能。本文將介紹如何在微信小程式中實作圖片上傳功能,並提供具體的程式碼範例。一、前期準備工作在開始編寫程式碼之前,我們需要先下載並安裝微信開發者工具,並註冊成為微信開發者。同時,也需要了解微信

實現微信小程式中的下拉式選單效果,需要具體程式碼範例隨著行動互聯網的普及,微信小程式成為了網路開發的重要一環,越來越多的人開始關注和使用微信小程式。微信小程式的開發相比傳統的APP開發更加簡單快捷,但也需要掌握一定的開發技巧。在微信小程式的開發中,下拉式選單是一個常見的UI元件,實現了更好的使用者操作體驗。本文將詳細介紹如何在微信小程式中實現下拉式選單效果,並提供具

實現微信小程式中的圖片濾鏡效果隨著社群媒體應用程式的流行,人們越來越喜歡在照片中應用濾鏡效果,以增強照片的藝術效果和吸引力。在微信小程式中也可以實現圖片濾鏡效果,為使用者提供更多有趣和創意的照片編輯功能。本文將介紹如何在微信小程式中實現圖片濾鏡效果,並提供具體的程式碼範例。首先,我們需要在微信小程式中使用canvas元件來載入和編輯圖片。 canvas元件可以在頁面

使用微信小程式實現輪播圖切換效果微信小程式是一種輕量級的應用程序,具有簡單、高效的開發和使用特點。在微信小程式中,實作輪播圖切換效果是常見的需求。本文將介紹如何使用微信小程式實現輪播圖切換效果,並給出具體的程式碼範例。首先,在微信小程式的頁面檔案中,新增一個輪播圖元件。例如,可以使用<swiper>標籤來實現輪播圖的切換效果。在該組件中,可以透過b

實現微信小程式中的圖片旋轉效果,需要具體程式碼範例微信小程式是一種輕量級的應用程序,為用戶提供了豐富的功能和良好的用戶體驗。在小程式中,開發者可以利用各種元件和API來實現各種效果。其中,圖片旋轉效果是一種常見的動畫效果,可以為小程式增添趣味性和視覺效果。在微信小程式中實作圖片旋轉效果,需要使用小程式提供的動畫API。以下是一個具體的程式碼範例,展示如何在小程

實作微信小程式中的滑動刪除功能,需要具體程式碼範例隨著微信小程式的流行,開發者在開發過程中經常會遇到一些常見功能的實作問題。其中,滑動刪除功能是常見、常用的功能需求。本文將為大家詳細介紹如何在微信小程式中實現滑動刪除功能,並給出具體的程式碼範例。一、需求分析在微信小程式中,滑動刪除功能的實作涉及以下要點:列表展示:要顯示可滑動刪除的列表,每個列表項目需要包

閒魚官方微信小程式已經悄悄上線,它為用戶提供了一個便捷的平台,讓你可以輕鬆地發布和交易閒置物品。在小程式中,你可以與買家或賣家進行私訊交流,查看個人資料和訂單,以及搜尋你想要的物品。那麼閒魚在微信小程式中究竟叫什麼呢,這篇教學攻略將為您詳細介紹,想要了解的用戶們快來跟著本文繼續閱讀吧!閒魚微信小程式叫什麼答案:閒魚,閒置交易二手買賣估價回收。 1、在小程式中可以發布閒置、與買家/賣家私訊交流、查看個人資料及訂單、搜尋指定物品等功能;2、在小程式的頁面中有首頁、附近、發閒置、訊息、我的5項功能;3、
