您好,登錄后才能下訂單哦!
小編給大家分享一下小程序中生成小程序碼的方法,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
導語:
小程序是一種不需要下載安裝即可使用的應用,它實現了應用“觸手可及”的夢想,用戶掃一掃或者搜一下即可打開應用。也體現了“用完即走”的理念,用戶不用關心是否安裝太多應用的問題。應用將無處不在,隨時可用,但又無需安裝卸載。
那么在小程序中,如何生成小程序碼?雖然小程序目前可以分享到朋友圈了的,但小程序碼的傳播無論是直接分享給好友,還是作為圖片分享,或是作為線下掃碼入口,都是引流的一種重要的入口。
實例效果:
具體實現:
小程序端代碼,在view元素上綁定事件
<view bindtap="onViewTap">小程序碼</view>
小程序端邏輯代碼
Page({ data: {}, // 綁定的點擊事件函數 onViewTap() { this.createQrCode(); // 調用生成小程序碼 }, // 生成小程序碼 createQrCode() { this.showLoading(); wx.cloud .callFunction({ // 請求云函數 // 云函數getQrCode name: 'getQrCode', }) .then((res) => { console.log(res); const fileId = res.result; wx.previewImage({ // 小程序碼,生成后直接預覽,前臺展示 urls: [fileId], current: fileId, }); this.hideLoading(); }); }, // toast生成中 showLoading() { wx.showLoading({ title: '正在生成中...', icon: 'none', }); }, hideLoading() { wx.hideLoading(); }, });
在小程序端就上面幾行代碼
云函數端實現代碼
在cloudFunctions文件夾下創建getQrCode云函數,會默認創建config.json,index.js,package.json三個文件
其中config.json內為
{ "permissions": { "openapi": [ "wxacode.getUnlimited" ] } }
上面的是利用wxacode.getUnlimited生成小程序碼的配置,這個配置是固定的
而index.js中如下代碼
// 云函數入口文件 const cloud = require('wx-server-sdk'); cloud.init(); // 云函數入口函數 exports.main = async (event, context) => { const wxContext = cloud.getWXContext(); // 獲取上下文 const result = await cloud.openapi.wxacode.getUnlimited({ // 調用生成小程序碼的接口,攜帶一些參數,例如:scene scene: wxContext.OPENID, }); // console.log(result) const upload = await cloud.uploadFile({ // 生成的小程序碼上傳到云存儲中 cloudPath: 'qrcode/' + Date.now() + '-' + Math.random() + '.png', // 生成的小程序碼存儲到云存儲當中去,路徑 fileContent: result.buffer, }); return upload.fileID; // 返回文件的fileID,也就是該圖片 };
生成小程序碼就是上面幾行簡單的云函數代碼就可可以實現,主要是利用wxacode.getUnlimited這個接口
獲取小程序碼,適用于需要的碼數量極多的業務場景。通過該接口生成的小程序碼,永久有效,數量暫無限制
以上是“小程序中生成小程序碼的方法”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。