欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

外部web端訪問微信小程序云數(shù)據(jù)庫的三種方法總結(jié)

 更新時間:2022年04月25日 09:39:41   作者:菜小黑  
最近在研究微信小程序的云開發(fā)功能,下面這篇文章主要給大家介紹了關(guān)于外部web端訪問微信小程序云數(shù)據(jù)庫的三種方法,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下

前言

我當(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)存泄露模式

    權(quán)威JavaScript 中的內(nèi)存泄露模式...
    2007-08-08
  • IE瀏覽器下PNG相關(guān)功能

    IE瀏覽器下PNG相關(guān)功能

    本文給大家匯總了一下png在IE瀏覽器下出現(xiàn)的各種問題的解決方法,十分的實用,有需要的小伙伴可以參考下。
    2015-07-07
  • JavaScript禁用右鍵單擊優(yōu)缺點分析

    JavaScript禁用右鍵單擊優(yōu)缺點分析

    在本篇文章里小編給大家分享了關(guān)于JavaScript禁用右鍵單擊優(yōu)缺點分析,有需要的朋友們學(xué)習(xí)下。
    2019-01-01
  • 微信小程序圖片上傳功能的實現(xiàn)方法

    微信小程序圖片上傳功能的實現(xiàn)方法

    在編寫小程序的項目過程中,難免會有需要上傳圖片,下面這篇文章主要給大家介紹了關(guān)于微信小程序圖片上傳功能的實現(xiàn)方法,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下
    2022-04-04
  • JavaScript 最佳實踐:幫你提升代碼質(zhì)量

    JavaScript 最佳實踐:幫你提升代碼質(zhì)量

    在本篇教程中,我將指出一些重要的 JavaScript 最佳實踐,讓你不必去用另外一種艱難的方式來了解它們。準(zhǔn)備好去升級你的代碼吧
    2016-12-12
  • Typescript協(xié)變與逆變簡單理解

    Typescript協(xié)變與逆變簡單理解

    深入學(xué)習(xí)TypeScript類型系統(tǒng)的話,逆變、協(xié)變、雙向協(xié)變、不變是繞不過去的概念。這些概念看起來挺高大上的,其實并不復(fù)雜,這篇文章我們就來學(xué)習(xí)下協(xié)變和逆變吧
    2022-10-10
  • JavaScript獲取圖片像素顏色并轉(zhuǎn)換為box-shadow顯示

    JavaScript獲取圖片像素顏色并轉(zhuǎn)換為box-shadow顯示

    這篇文章主要介紹了JavaScript獲取圖片像素顏色并轉(zhuǎn)換為box-shadow顯示的方法,用到了HTML5中的FileReader API和getImageData,轉(zhuǎn)換為的CSS3 box-shadow也要注意瀏覽器的兼容問題,需要的朋友可以參考下
    2016-03-03
  • Javascript 計算字符串在localStorage中所占字節(jié)數(shù)

    Javascript 計算字符串在localStorage中所占字節(jié)數(shù)

    本文給大家分享的是使用Javascript 計算字符串在localStorage中所占字節(jié)數(shù),分別對UTF-8和UTF-16兩種編碼進行了詳細(xì)說明,有需要的小伙伴可以參考下。
    2015-10-10
  • JavaScript?評測代碼運行速度的案例代碼

    JavaScript?評測代碼運行速度的案例代碼

    在?JavaScript?中,可以使用?performance.now()?API?來評測代碼的運行速度。該?API?返回當(dāng)前頁面的高精度時間戳,您可以在代碼執(zhí)行前后調(diào)用它來計算代碼執(zhí)行所需的時間,這篇文章主要介紹了JavaScript?評測代碼運行速度,需要的朋友可以參考下
    2023-02-02
  • 詳解基于webpack&gettext的前端多語言方案

    詳解基于webpack&gettext的前端多語言方案

    這篇文章主要介紹了詳解基于webpack&gettext的前端多語言方案,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2019-01-01

最新評論