中文字幕理论片,69视频免费在线观看,亚洲成人app,国产1级毛片,刘涛最大尺度戏视频,欧美亚洲美女视频,2021韩国美女仙女屋vip视频

產(chǎn)品歷經(jīng)多次迭代，一直沒有提供二維碼組件。在日常小程序中，二維碼出示還是一個(gè)很常用的功能。官方不提供，我們也只能曲線實(shí)現(xiàn)了。

• 尋找一個(gè)開源的在線二維碼網(wǎng)站

• 將生成的二維碼上傳到云存儲中

1 二維碼在線生成網(wǎng)站

https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=你的內(nèi)容

這個(gè)網(wǎng)站可以幫我們生成二維碼

2 頁面搭建

我們提供用戶輸入一個(gè)內(nèi)容，點(diǎn)擊生成二維碼按鈕來顯示二維碼，點(diǎn)擊上傳二維碼將圖片上傳到云存儲中

先定義一個(gè)變量data用來存放單行輸入的內(nèi)容，另外創(chuàng)建一個(gè)變量url來存放拼接的二維碼的地址

給單行輸入組件綁定值改變事件，方法選擇變量賦值，將文本框的內(nèi)容賦值給我們的data變量

圖片組件的地址綁定我們的url

將第一個(gè)按鈕的內(nèi)容改為生成二維碼，并且綁定點(diǎn)擊事件，方法選擇變量賦值，使用表達(dá)式進(jìn)行綁定

"https://api.qrserver.com/v1/create-qr-code/?size=150x150&data="+$page.dataset.state.data

表達(dá)式使用字符串連接，來進(jìn)行組裝地址

第二個(gè)按鈕的內(nèi)容改為下載二維碼，綁定點(diǎn)擊事件，方法選擇javascript代碼，需要自己創(chuàng)建一個(gè)自定義方法，方法的內(nèi)容為

export default function({event, data}) {    app.cloud.callConnector({      name:'download_k5hg33q',      methodName:'dowloadpic',      params:{        data:$page.dataset.state.data      }    })}

我們調(diào)用了一個(gè)API來實(shí)現(xiàn)圖片的上傳

3 創(chuàng)建API

在控制臺，點(diǎn)擊新建APIs

選擇云開發(fā)云函數(shù)

輸入名稱和標(biāo)識，點(diǎn)擊管理云函數(shù)

點(diǎn)擊新建云函數(shù)

輸入函數(shù)名稱

切換到函數(shù)代碼，點(diǎn)擊文件，點(diǎn)擊新建輸入package.json

輸入如下內(nèi)容

{  "name": "app",  "version": "1.0.0",  "description": "",  "main": "index.js",  "scripts": {},  "author": "",  "license": "ISC",  "dependencies": {    "@cloudbase/node-sdk": "latest"  }}

然后點(diǎn)擊保存并安裝依賴

在index.js里輸入如下代碼

'use strict';const request = require('request');const tcb = require('@cloudbase/node-sdk')const app = tcb.init({})exports.main = async (event, context) => {    var options = {        url: 'https://api.qrserver.com/v1/create-qr-code/?size=150x150&data='+event.data,        encoding: null,        headers: {            "content-type": "application/octet-stream",        },    };    return new Promise(function (resolve, reject) {        request(options, function (error, response, body) {            if (!error && response.statusCode == 200) {                resolve(                    app.uploadFile({                        cloudPath: event.data+".png",                        fileContent: body,                    })                )            }        });    })};

代碼的意思是通過request模塊訪問二維碼的地址，將訪問的結(jié)果上傳到云存儲中

設(shè)置好之后點(diǎn)擊保存按鈕讓云函數(shù)部署并生效，回到我們的API中，選擇我們剛剛創(chuàng)建的云函數(shù)

增加一個(gè)入?yún)?，參?shù)寫data，點(diǎn)擊方法測試

點(diǎn)擊運(yùn)行測試，然后點(diǎn)擊出參映射就可以看到我們的返回結(jié)果，上傳成功后會(huì)給返回一個(gè)fileid

進(jìn)入到云開發(fā)cloudbase里，找到我們的云存儲，可以看到上傳的二維碼

我們可以調(diào)用數(shù)據(jù)源的方法將圖片的fileid存入數(shù)據(jù)源中，這樣如果下次希望顯示或者下載直接從數(shù)據(jù)源獲取就可以

總結(jié)

本篇我們講解了如何借助第三方的二維碼服務(wù)來實(shí)現(xiàn)我們的二維碼顯示及上傳功能，有時(shí)候采取一個(gè)折中方案也可以幫助你的應(yīng)用快速上線，最重要的就是實(shí)現(xiàn)功能。