外部web端訪問微信小程序云數(shù)據(jù)庫的三種方法總結(jié)
前言
我當(dāng)前的項目是小程序開發(fā),使用的是云開發(fā)方式,那么這時涉及到了小程序端提交的數(shù)據(jù)會保存到云數(shù)據(jù)庫中,可是呢這些個數(shù)據(jù)要被外部訪問用來管理,也就是還得弄一個管理后臺界面管理這些數(shù)據(jù)。那就需要拿到云數(shù)據(jù)庫里面的數(shù)據(jù)啦,下面就是對如何拿到云數(shù)據(jù)庫里面的數(shù)據(jù)的訪問方式的描述
看到評論表示看不懂,不知道具體怎么用,決定再做補充
注意:下面的三種方法中第一、第三種方法會存在跨域問題,沒有具體實現(xiàn),當(dāng)是我在開發(fā)的時候是用配置代理的方式,但是線上環(huán)境是沒有辦法設(shè)置代理的,
所以我選擇了第二種方式,
重點補充第二點的具體用法
一、HTTP API 方式
微信小程序文檔中的云開發(fā)部分有特別說明了,HTTP API的調(diào)用方式,這里貼上鏈接HTTP API
下面來看看具體是怎么使用的
1、web端調(diào)用云函數(shù)
微信開放文檔中說明了,web端調(diào)用云函數(shù)的方式:
文檔說明了,如果要觸發(fā)云函數(shù)就要調(diào)用上面紅色框住的鏈接。但是有一點,需要拿到access_token的值
獲取access_token的值:
以上就是獲取憑證的調(diào)用鏈接。
具體到代碼里的使用:
在代碼里直接按平時我們請求接口的方式調(diào)用,
下面來看看打印結(jié)果:
可以看到這里報錯了,這個跨域的問題。
嘗試了一種解決方案,代理
在配置文件里加上代理。
最后請求獲取access_token會變成這樣
原來的域名換成了api代替。
看看打印結(jié)果:
已經(jīng)拿到了access_token
現(xiàn)在可以用這個獲取到的accesss_token來調(diào)云函數(shù)了。
這種方式因為是訪問鏈接的方式,會存在跨域訪問的問題,如果項目上線了要做跨域處理。
注意:不管是post方式還是get方式,都不能把鏈接后帶的參數(shù)提出來,只能拼接在后面哦,如果是要傳自己的參數(shù)就可以用對象方式傳。不然訪問時會得不到想要的結(jié)果
二、Web SDK 在 Web 中使用
1.Web SDK 在 Web 中使用,可以訪問云開發(fā)資源,既支持公眾號登錄態(tài)、也支持未登錄模式。
補充:這里我用紅色標(biāo)注了,要特別注意
要在外部訪問云開發(fā)資源,除了公眾號支持登錄態(tài),其他地方訪問是不支持登錄態(tài)訪問的,得用未登錄態(tài)模式(這里涉及到安全規(guī)則)
這里粘上鏈接未登錄模式下訪問云開發(fā)資源
那安全規(guī)則怎么設(shè)置?
這里貼上步驟
1、打開開發(fā)中工具 》 云開發(fā) 》這時會打開云開發(fā)控制臺。
設(shè)置好未登錄態(tài)后,具體怎么訪問步驟
訪問鏈接:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/web/sdk.html
可以看到 微信描述的怎么訪問,
1、找到底部cdn地址,下載拷貝下來。
2、將拷貝下來的cdn文件放到項目中,在項目入口文件中引入,作為公共使用。
import "../../common/cloud/cloud.js";
這時window對象下面會掛載一個cloud對象, 我在我的項目中初始化cloud對象,在app.vue文件中寫入下面方法,并調(diào)用,我在created方法中調(diào)用下面的fun方法,并將已授權(quán)對象保存為公用對象store中。
async function fun() { // 聲明新的 cloud 實例 var c1 = new cloud.Cloud({ // 必填,表示是未登錄模式 identityless: true, // 資源方 AppID resourceAppid: '小程序appid', // 資源方環(huán)境 ID resourceEnv: '云開發(fā)環(huán)境id', }) await c1.init( { appid: '小程序appid', env: '云開發(fā)環(huán)境id' } ) this.$store.commit('initCloud', c1 || ''); }
3、如何調(diào)用這個對象呢?
當(dāng)項目中某個頁面需要拿數(shù)據(jù)庫的數(shù)據(jù)。調(diào)用保存的cloud對象中的callFunction方法,該方法可以調(diào)用我們自己在小程序中定義的云函數(shù),至于這個云函數(shù)要怎么寫,怎么定義就要自己去看小程序開發(fā)檔中云開發(fā)的知識了。這里只講怎么從外部訪問小程序云數(shù)據(jù)庫。
// 調(diào)用云函數(shù)編輯 let $this = this; this.$store.state.cloud.callFunction({ name: 'addPartyMember', data: params, success: res => { // res 就是重云函數(shù)中拿到的數(shù)據(jù),這里里面含有云函數(shù)處理云數(shù)據(jù)庫的結(jié)果 let result = res.result.dbresult; if (result.stats) { $this.$message({ type: 'success', message: '操作成功' }) } }, fail: err => { $this.$message.error('失敗') } })
注意這種未登錄模式下好像不能直接訪問云數(shù)據(jù)庫,只能通過訪問云函數(shù)間接操作數(shù)據(jù)庫
補充結(jié)束,這是我在項目中的具體實現(xiàn),如果有更好方法一起交流哦?。?!
2、使用騰訊云里的方法
這里直接粘上鏈接web使用 JavaScript 訪問 Cloudbase 服務(wù)和資源。 文檔很清楚
總結(jié)
到此這篇關(guān)于外部web端訪問微信小程序云數(shù)據(jù)庫的三種方法的文章就介紹到這了,更多相關(guān)外部web端訪問小程序云數(shù)據(jù)庫內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
權(quán)威JavaScript 中的內(nèi)存泄露模式
權(quán)威JavaScript 中的內(nèi)存泄露模式...2007-08-08JavaScript獲取圖片像素顏色并轉(zhuǎn)換為box-shadow顯示
這篇文章主要介紹了JavaScript獲取圖片像素顏色并轉(zhuǎn)換為box-shadow顯示的方法,用到了HTML5中的FileReader API和getImageData,轉(zhuǎn)換為的CSS3 box-shadow也要注意瀏覽器的兼容問題,需要的朋友可以參考下2016-03-03Javascript 計算字符串在localStorage中所占字節(jié)數(shù)
本文給大家分享的是使用Javascript 計算字符串在localStorage中所占字節(jié)數(shù),分別對UTF-8和UTF-16兩種編碼進行了詳細(xì)說明,有需要的小伙伴可以參考下。2015-10-10