国产91在线无码_少妇人妻无码高清_91人妻中文字幕无码专区在线_国产福利在线播放_免费 无码 国产成年视频网站

前端,你能生成自定義的微信小程序二維碼嗎?(前端,你能生成自定義的微信小程序二維碼嗎)

我們經(jīng)常會遇到微信小程序分享海報中帶一個二維碼,通過掃描或識別二維碼可以直接進入對應的小程序,而且還會帶一些參數(shù),你生成過這種二維碼嗎?

前端和后端都可以生成二維碼,由于小姐姐是做前端的,所以我們主要介紹前端是如何生成微信小程序二維碼的!

一、實現(xiàn)原理及步驟:

1、通過小程序的 appId 和 密鑰(secret) 通過請求官方提供的接口:'https://api.weixin.qq.com/cgi-bin/token,取得 access_token 。

2、準備需要傳遞的參數(shù),和需要掃碼進入的頁面路徑。

格式為:

let data = { scene: '1',要傳遞的參數(shù) page: 'pages/index/index',掃碼進入的小程序頁面}

3、通過 access_token 獲取小程序二維碼,格式為二進制圖片。

二、具體實現(xiàn)

1、獲取 access_token

wx.request({ url: 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=?&secret=?', method: 'get', success: function (res) { console.log(res.data.access_token) }})

2、生成二維碼。

let data = { scene: '1', //要傳遞的參數(shù) page: 'pages/index/index', //掃碼進入的小程序頁面}let self = this;wx.request({ url: 'https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=31_92uKEw2joJRdBP75gViNwBwZu-LGZ4-99EwkjpOy-iT3yW4B4Q7e_iscapbVQ3uIBoJXdo5sv0IJVyz8e6XfxAZHAbmmSFi8W1Fhu-OTSNJBQ57_h0aOlfjUIxChman-gaxZy_XOQVgdwpJ8DTRaAFAJZX', method: 'post', data:data, responseType: 'arraybuffer', //將返回數(shù)據(jù) 按文本解析修改為arraybuffer success: function (res) { self.setData({ //再arraybuffer轉(zhuǎn)為base64 顯示圖片 url: 'data:image/png;base64,' wx.arrayBufferToBase64(res.data) }) }})

3、完整代碼

Page({ /* 頁面的初始數(shù)據(jù) */ data: { url:"", token:"" }, getToken(){ let self = this; wx.request({ url: 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=wx77c6ac47129ed2bf&secret=e5d38623f660b4387d62bd6efcaf67e8', method: 'get', success: function (res) { self.setData({ token:res.data.access_token }) self.createQR() } }) }, createQR(){ let self = this let data = { scene: '123456', page: 'pages/index/index', } wx.request({ url: `https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=${this.data.token}`, method: 'post', data:data, responseType: 'arraybuffer', //將返回數(shù)據(jù) 按文本解析修改為arraybuffer success: function (res) { self.setData({ //再arraybuffer轉(zhuǎn)為base64 顯示圖片 url: 'data:image/png;base64,' wx.arrayBufferToBase64(res.data) }) } }) }, /** * 生命周期函數(shù)--監(jiān)聽頁面加載 */ onLoad: function (options) { this.getToken() }, })

三、常見問題

3.1、生成失敗

生成二維碼失敗,并提示:{"errcode":41030,"errmsg":"invalid page rid: 6265f9d4-2debac47-4d9bd706"}

"errcode":41030 可能的原因有:

  • page 路徑不正確。
  • page 路徑最前面有 "/",需要去掉 “/”
  • 微信小程序是否上線,掃碼只能進入線上版本。
  • page 路徑是否已經(jīng)在線上實現(xiàn)

3.2、安全問題

  • 為了小程序安全起見,https://api.weixin.qq.com 通常不可以在前端直接請求。
  • 微信小程序直接調(diào)用 https://api.weixin.qq.com ,會出現(xiàn)錯誤,原因是 api.weixin.qq.com 不能被配置為服務器域名,所以是不能請求的。

前端可以通過云開發(fā)不依靠后臺實現(xiàn)自定義生成小程序二維碼,或者通過后臺生成。

3.3、access_token

access_token 單日獲取次數(shù)有限制,超過次數(shù)限制將無法獲取到 access_token,使用時可以開啟緩存,有效期為 2 小時。

access_token 均來自于中控服務器,不應該各自去刷新,否則容易造成沖突,導致access_token 覆蓋而影響業(yè)務;

版權聲明:本文內(nèi)容由互聯(lián)網(wǎng)用戶自發(fā)貢獻,該文觀點僅代表作者本人。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。如發(fā)現(xiàn)本站有涉嫌抄襲侵權/違法違規(guī)的內(nèi)容, 請發(fā)送郵件至 舉報,一經(jīng)查實,本站將立刻刪除。

(0)
上一篇 2023年4月3日 上午11:37
下一篇 2023年4月3日 上午11:53

相關推薦