uniapp上直接進行微信小程序雲開發筆記

uniapp上直接進行微信小程序雲開發筆記

開發框架是用的uniapp，雲開發用的還是微信的雲開發，沒有使用自帶的uniCloud;

本文主講在uniapp上需要修改的基本配置。

0.創建雲函數目錄

在項目根目錄,自定義創建用於存放雲函數的文件夾。筆者爲：cloudfunctions

1.設置微信小程序配置

項目根目錄找到 manifest.json文件,修改mp-weixin字段,指定本地已存在的目錄作爲雲開發的本地根目錄：

// 添加雲函數文件夾地址
"mp-weixin" : {
  "cloudfunctionRoot":"cloudfunctions/"
},

更多說明查看微信文檔:

編輯器中操作雲開發雲函數 & 雲託管 | 微信開放文檔 (qq.com)

2.修改vue.config.js本地環境配置

在默認框架環境下，該文件需要手動創建,同時需要手動安裝同步文件的插件copy-webpack-plugin；

由於非特定目錄，其他根目錄必須手動複製同步；

# 根據管兼容提醒，安裝5.0.0 版本
npm install [email protected]

設置同步腳本

const path = require('path')
const CopyWebpackPlugin = require('copy-webpack-plugin') //最新版本copy-webpack-plugin插件暫不兼容，推薦v5.0.0

module.exports = {
    configureWebpack: {
        plugins: [
			new CopyWebpackPlugin([
			  {
			    from: path.join(__dirname, '{{自定義的目錄}}'),
			    to: path.join(__dirname, 'unpackage', 'dist', process.env.NODE_ENV === 'production' ? 'build' : 'dev', process.env.UNI_PLATFORM, 'cloudfunctions'),
			  },
			]),
        ]
    }
}

到這裏完成後，uniapp編輯器會自動同步雲函數文件。

更多具體配置說明:

vue.config.js - uni-app官網 (dcloud.net.cn)

3.微信雲函數基礎流程

3.1創建一個自定義雲函數名稱，作爲目錄,如下：

| -> hello // 雲函數名稱
| | -> config.json
| | -> index.js
| | -> pakage.json

一個基本的雲函數包含3個文件:

config.json:用於聲明雲函數需要的配置信息，如權限

index.js:雲函數的主文件，基本邏輯入口

pakage.json:雲函數環境配置文件,依賴說明

3.2編寫函數腳本:

獲取小程序的檢驗信息接口權限

{
	"permissions": {
		"openapi": [
		  "security.msgSecCheck"
		]
	}
}

檢驗文本信息腳本:

// 雲函數入口文件
const cloud = require('wx-server-sdk')
cloud.init({
  env: cloud.DYNAMIC_CURRENT_ENV
});

exports.main = async (event, context) => {
	//event爲客戶端上傳的參數
	// console.log('event : ', event)
	const r = await cloud.openapi.security.msgSecCheck({
		content:event.msg
	})
	
	//返回數據給客戶端
	return r
};

環境配置,(npm 模式):

{
  "name": "hello", // 對應雲函數名稱
  "version": "1.0.0",
  "description": "",
  "main": "index.js", // 主入口文件
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "wx-server-sdk": "~2.4.0" // 依賴環境
  }
}

3.3 創建/上傳雲函數

下面操作，需要在小程序開發工具，編輯器內完成。

1. 如果雲函數未創建
   1. 右鍵函數文件夾，上傳文件並部署。
   2. 提示上傳文件成功後，再右鍵雲端安裝依賴，提示權限已更新即可。
2. 如果已有云函數
   1. 沒有修改權限與環境，直接更新文件即可
   2. 有修改權限，需要重新安裝依賴

3.4 小程序客戶端調用

export default {
  onReady() {
    wx.cloud.init(); // 必須要的初始化一次
  },
  methods(){
		test(){
      	// 執行雲函數
      	wx.cloud.callFunction({
				  // 雲函數名稱
				  name: 'hello',
				  // 傳給雲函數的參數
				  data: {
				    msg: self.nickname,
				  },
				  success: function(res) {
						// res.result
				  }
				});
    }
  }
}