微信小程序中是什么：——云函数.js

微信小程序里有什么：

————

用户是小程序为每个用户在访问小程序时生成的标识id。 类似于我们生活中的身份证号码，每个号码只对应一个用户。

角色：

————

用户的特征准确、唯一，可用于数据集成等场景，将各种数据分发到每个用户。 比如我们常见的“我的”页面，展示的是我们自己的相关数据。

同时，在设置小程序的支付功能时，小程序官方会将设置设为必填项，以防止交易过程中出现定向错误。

————

有了基本的了解之后，我们就开始创建这个项目了！

打开微信开发者工具，新建一个项目，选择“小程序·云开发”。

根据开发者工具的要求创建一个目录，输入AppID（在微信公众平台小程序号的设置中找到），或者使用测试号。

进入开发界面

进入app.json创建一个新页面

在“pages”中输入“页面/文件夹名/文件名”，点击编译（Ctrl+S），即可在pages文件夹中自动生成page文件夹。 如果没有生成，可以手动创建。

上面的代码：

wxml:

<text>看，我要在这里显示openid"{{openid}}"text>

{{}}的作用是在js中获取数据视图层数据，以便可以显示在视图页面上，效果为

js:

Page({
  /**
   * 页面的初始数据
   */
  data: {
    openid: "待会这里变成openid"
  }
})

我设置一个初始数据是为了让新手朋友知道视图层数据在哪里。 这时候我们去调试器查找数据，此时数据已经生成了。

同时显示页面。

现在我们开始获取创建云函数

在刚才指向的云函数文件夹中创建一个云函数，右键该文件夹，新建一个node.js云函数，我命名为

这时候设置index.js就够了，但是强大的微信团队已经自动为我们生成了一些信息。 仔细一看，这就是我们需要的。

云函数index.js：

// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
// 云函数入口函数
exports.main = async (event, context) => {
  const wxContext = cloud.getWXContext()
  return {
    event,
    openid: wxContext.OPENID,
    appid: wxContext.APPID,
    unionid: wxContext.UNIONID,
  }
}

而这就是我们云函数的基本格式，包括云函数入口文件和云函数入口函数，这两者都是缺一不可的，特别是大家去掉内容才能看到基本格式。

// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
// 云函数入口函数
exports.main = async (event, context) => {
 
}

注意：我们每次要使用云函数或者编辑云函数后，都需要右键云函数（这里是文件夹），选择第三项，上传部署（云安装依赖），上传并部署云功能部署。 出现部署成功提示后，云功能才能正常使用，如下图所示。

————

调用云函数获取用户的

回到页面中的js，开始调用云函数。

()函数，生命周期函数——监控页面加载，也就是页面加载完成后开始运行里面的逻辑函数。

// pages/index/index.js
Page({
  /**
   * 页面的初始数据
   */
  data: {
    openid: "待会这里变成openid"
  },
  
  onLoad(){
    wx.cloud.callFunction({
      // 云函数名称
      name: 'getOpenid',
      // 云函数获取结果
      success: function(res) {
        console.log("云函数调用成功！",res)
      },
      fail: function(error) {
        console.log("云函数调用失败！",error)
      },
    })
  }
})

此时编译并查看调试器。 说明云函数调用成功，点击下方的开发按钮。

使用 this.() 函数

此时我们抓取它并将其放入本地数据逻辑层。 使用this.()函数，该函数的作用是将逻辑层数据发送到视图层。

// pages/index/index.js
let openid = '';
Page({
  /**
   * 页面的初始数据
   */
  data: {
    openid: "待会这里变成openid"
  },
  
  onLoad(){
  	//由于this指向的是相对于wx:request()的当前对象，在request全局使用，
  	//所以我们必须设置一个相对于当前对象的变量that，将this的值赋给that,
  	//才可以在onloud()页面加载（当前对象）中正常运作函数
    var that = this
    
    wx.cloud.callFunction({
      // 云函数名称
      name: 'getOpenid',
      // 云函数获取结果
      success: function(res) {
        console.log("云函数调用成功！",res)
        
        //利用相对于当前对象的that抓取数据
        that.setData({
          openid: res.result.openid
        })
      },
      fail: function(error) {
        console.log("云函数调用失败！",error)
      },
    })
  }
})

此时编译后，视图层的数据值发生了变化：

与此同时，页面也发生了变化：

使用wx.()函数

为了方便起见，我们可以使用wx.( )函数将指定key中的数据存储到本地缓存中，以便以后直接搜索用户。

wx.setStorage({
          data: 'data',
          key: 'key',
        })

// pages/index/index.js
let openid = '';
Page({
  /**
   * 页面的初始数据
   */
  data: {
    openid: "待会这里变成openid"
  },
  
  onLoad(){
    var that = this
    wx.cloud.callFunction({
      // 云函数名称
      name: 'getOpenid',
      // 云函数获取结果
      success: function(res) {
        console.log("云函数调用成功！",res)
        
        //抓取数据
        that.setData({
          openid: res.result.openid
        })
        //将数据缓存到本地
        wx.setStorage({
          data: that.data.openid,
          key: 'openid',
        })
        //从本地缓存拉取数据
        let opid = wx.getStorageSync('openid')
        console.log(opid)
      },
      fail: function(error) {
        console.log("云函数调用失败！",error)
      },
    })
  }
})

以后当我们需要获取当前用户时，可以在所有页面调用wx.('key')函数

	let opid = wx.getStorageSync('openid')
    console.log(opid)

我不是专业程序员，这里只是跟大家分享一下我的小程序设计经验。

如果有不妥的地方，欢迎留言指正，我们共同学习。

更多设计和功能学习经验，也可以到我的公众号查看！

————

TAG标签：小程序setdata