uni-app使用微信小程序云函数的步骤示例

创建云函数⽬录

⾸先，我们需要在uni-app项⽬⽂件夹下，创建⼀个云函数⽬录，路径随意，我这⾥是functions。然后先随便在⾥⾯放⼀些⽂件，这⾥以new_file.css为例。(放⽂件的原因是：确保编译成⼩程序后cloudfunctions⽂件夹存在。如果该⽂件夹下没有⽂件，默认是不会在微信⼩程序开发平台中显⽰该⽂件夹的。)

修改manifest.json

在uni-app根⽬录下，修改manifest.json中的微信⼩程序项，结构如下

\"mp-weixin\" : {

/* ⼩程序特有相关 */

\"appid\" : \"wxd7de467f6e6cf741\

\"cloudfunctionRoot\": \"./functions/\这⼀⾏就是标记云函数⽬录的字段 \"setting\" : {

\"urlCheck\" : false },

\"usingComponents\" : true }

编写vue.config.js

我们在项⽬根⽬录创建vue.config.js⽂件

写⼊以下内容（如路径不⼀样请做相应适配）

const path = require('path')

const CopyWebpackPlugin = require('copy-webpack-plugin')

module.exports = { configureWebpack: { plugins: [

new CopyWebpackPlugin([ {

from: path.join(__dirname, 'functions'),

to: path.join(__dirname, 'unpackage/dist', process.env.NODE_ENV === 'production' ? 'build' : 'dev', process.env.UNI_PLATFORM, 'functions') } ]) ] }}

编译运⾏发现提⽰如下内容

说明未安装copy-webpack-plugin插件，我们⼿动安装⼀下。

然后编译运⾏，发现微信开发者⼯具⾥⾯出现以下内容。

截⽌⽬前，已打通Hbuilder X到微信开发者⼯具的⾃动复制，即已解决本⽂的核⼼内容。以下为进⼀步测试。创建云函数

(在微信开发者⼯具操作)我们在云函数根⽬录上右键，在右键菜单中，可以选择创建⼀个新的 Node.js 云函数，我们将该云函数命名为check。开发者⼯具在本地创建出云函数⽬录和⼊⼝ index.js ⽂件，同时在线上环境中创建出对应的云函数。创建成功后，⼯具会提⽰是否⽴即本地安装依赖，确定后⼯具会⾃动安装 wx-server-sdk。我们会看到以下内容。

创建好后将其同步复制到uni-app项⽬，即可为以后⾃动同步⾏⽅便，⼜可避免在输出⽂件夹中云函数的意外丢失。⾄此，相关⽂件编写⼯作转⾄Hbuilder X，云函数上传部署依旧在微信开发者⼯具。

编写云函数

默认的云函数只是⼀个返回⽤户基本数据的内容，我们将其修改⾄满⾜我们的业务需求，以内容安全云调⽤为例。在云函数⽂件中写⼊以下内容

// 云函数⼊⼝⽂件

const cloud = require('wx-server-sdk')cloud.init()

// 云函数⼊⼝函数

exports.main = async(event, context) => { try {

console.log('待检测⽂本:' + event.content);

let result = await cloud.openapi.security.msgSecCheck({ content: event.content })

console.log('result:' + JSON.stringify(result)); if (result && result.errCode.toString() === '87014') { return { code: 300,

msg: '内容含有违法违规内容', data: result }

} else { return { code: 200, msg: 'ok', data: result } }

} catch (err) {

if (err.errCode.toString() === '87014') { return { code: 300,

msg: '内容含有违法违规内容', data: err } }

return { code: 400,

msg: '调⽤security接⼝异常', data: err } }}

权限申明

在函数⽬录下，创建⼀个config.json,⽂档说会⾃动创建，但是实际操作时可能不会⾃动创建。config.json内容如下。

{

\"permissions\": { \"openapi\": [

\"security.msgSecCheck\" //接⼝名 ] }}

⼩程序调⽤云函数

wx.cloud.init() //调⽤前需先调⽤init wx.cloud.callFunction({ name: 'check', data: {

\"content\": this.contents.join() }

}).then(res => {

console.log(res.result)

if (res.result.code == 300) { uni.showModal({ title: \"温馨提⽰\

content: \"你所输⼊的内容可能含有违法违规内容，不⽀持进⾏下⼀步操作\" }) return } else {

... // 你要进⾏的操作 } })

效果展⽰

如果第⼀次出现错误：invalid scope 没有权限，请先开通云服务

这是因为 ⼩程序开发选择了云服务开发，但是没有开通云服务导致，点击微信开发⼯具上⽅的 云开发按钮，开通云开发。

新建云函数(上床并部署后会⾃动出现)

到此这篇关于uni-app使⽤微信⼩程序云函数的步骤⽰例的⽂章就介绍到这了,更多相关uni-app使⽤微信⼩程序云函数内容请搜索以前的⽂章或继续浏览下⾯的相关⽂章希望⼤家以后多多⽀持！