前言 只要你的小程序超过一个页面那么可能会需要涉及到页面参数的传递，下面我总结了 4 种页面方法。 路径传递 通过在url后面拼接参数，参数与路径之间使用 ? 分隔，参数键与参数值用 = 相连，不同参数用 & 分隔；如 ‘path?key=value&key2=value2’。 案例：A页面带参数跳转到B页面 A页面跳转代码 [代码]goB(){ wx.navigateTo({ url: '/pages/B/index?id=value', }) }, [代码] B页面接收代码 [代码]onLoad: function (options) { console.log('id', options.id) } [代码] 上面的案例是字符串参数，但是很多情况下需要传递对象，如下方代码。 [代码]Page({ data: { userInfo:{ name:'cym', age:16 } }, goB(){ wx.navigateTo({ url: '/pages/B/index?id='+this.data.userInfo, }) }, }) [代码] 如果使用上面同样的方式结构，输出的结果是：[object Object] 这个时候需要先把对象通过JSON.stringify(obj)将 object 对象转换为 JSON 字符串进行参数传递，再到接收页面通过JSON.parse解析使用。 A页面跳转代码 [代码] goB(){ let userStr = JSON.stringify(this.data.userInfo) wx.navigateTo({ url: '/pages/B/index?id='+userStr, }) } [代码] B页面接收代码 [代码]onLoad: function (options) { console.log('id', JSON.parse(options.id)) } [代码] 全局变量 通过App全局对象存放全局变量。 app.js代码 [代码]App({ // 存放对象的全局变量 globalData:{}, }) [代码] A页面跳转代码 [代码]// 获取App对象 const app = getApp() Page({ /** * 页面的初始数据 */ data: { userInfo: { name: 'cym', age: 16 } }, goB() { app.globalData.userInfo = this.data.userInfo wx.navigateTo({ url: '/pages/B/index', }) }, }) [代码] B页面接收代码 [代码]// 获取全局对象 const app = getApp() Page({ onLoad: function (options) { console.log(app.globalData.userInfo) } }) [代码] 存放在 App 全局变量里面，可以被多个页面使用，直接从 App 对象获取即可。这个数据是保持在内测中，每次小程序销毁就没有了。 数据缓存 通过存储到数据缓存中。 A页面跳转代码 [代码] goB() { wx.setStorageSync('userInfo', this.data.userInfo) wx.navigateTo({ url: '/pages/B/index', }) } [代码] B页面接收代码 [代码] onLoad: function (options) { let userInfo = wx.getStorageSync('userInfo', this.data.userInfo) console.log(userInfo) } [代码] 存放在数据缓存里面，可以被多个页面使用，直接用 getStorageSync 获取即可。这个数据是保持在数据缓存中，除非清楚数据缓存或者删除小程序否则一直存在。 事件通信 通过事件通信通道。 A页面跳转代码 [代码]goB() { wx.navigateTo({ url: '/pages/B/index', success:(res)=>{ // 发送一个事件 res.eventChannel.emit('toB',{ userInfo: this.data.userInfo }) } }) } [代码] B页面接收代码 [代码]onLoad: function (options) { // 获取所有打开的EventChannel事件 const eventChannel = this.getOpenerEventChannel(); // 监听 index页面定义的 toB 事件 eventChannel.on('toB', (res) => { console.log(res.userInfo) }) } [代码] 总结 大家可以针对具体业务场景来进行选择合适自己的传参方式。

微信云托管是微信团队联合腾讯云团队提供的以云原生为基础的免运维、高可用服务上云解决方案，无需服务器，1分钟即可部署小程序/公众号服务端。 PC 端访问 https://cloud.weixin.qq.com 即可立即开始使用微信云托管，新用户首个环境赠送 3 个月免费额度。 一、准备工作第 1 步：开通进入 微信云托管，选择小程序/公众号帐户进行登录。 [图片] 第 2 步：部署目前微信云托管提供两种部署方式，无门槛部署以及自定义部署，本文在初始化的时候将采用无门堪方式进行部署； 选择自己熟悉语言的模版，点击「使用」按钮，进入下一步,本文将使用Express模版进行自动部署 [图片] 云托管将会根据模版内容进行自动部署，模版中如有依赖数据库，将会在部署时自动开通数据库 [图片] 部署成功后可直接通过公网域名访问模版中的应用,并且提供调用代码片段 [图片] 模版中提供的计数器的应用 [图片] 二、开始改造第 1 步：拉取代码官方模版代码传送门：https://github.com/WeixinCloud/wxcloudrun-express 拉取成功后,目录文件如下： |.dockerignore |.gitignore |container.config.json |db.js |Dockerfile |index.html |index.js |LICENSE |package.json |README.md 第 2 步：使用websocket相关依赖本文中使用express-ws进行websocket服务搭建 express-ws第 3 步：改造服务端代码const path = require('path') const express = require('express') const cors = require('cors') const morgan = require('morgan') const { init: initDB, Counter } = require('./db') const logger = morgan('tiny') const app = express(); const expressWs = require('express-ws')(app); const clients = expressWs.getWss('/').clients app.ws('/', function (ws, req) { }); app.use(express.urlencoded({ extended: false })) app.use(express.json()) app.use(cors()) app.use(logger) // 首页 app.get('/', async (req, res) => { res.sendFile(path.join(__dirname, 'index.html')) }) // 更新计数 app.post('/api/count', async (req, res) => { const { action } = req.body if (action === 'inc') { await Counter.create() } else if (action === 'clear') { await Counter.destroy({ truncate: true }) } //数据改变后将结果推送至客户端 for (let c of clients) { c.send(await Counter.count()) } res.send({ code: 0, data: await Counter.count() }) }) // 获取计数 app.get('/api/count', async (req, res) => { const result = await Counter.count() res.send({ code: 0, data: result }) }) // 小程序调用，获取微信 Open ID app.get('/api/wx_openid', async (req, res) => { if (req.headers['x-wx-source']) { res.send(req.headers['x-wx-openid']) } }) const port = process.env.PORT || 80 async function bootstrap() { await initDB() app.listen(port, () => { console.log('启动成功', port) }) } bootstrap(); 第 4 步：通过流水线(CI/CD)部署改造后代码首先将修改后代码上传到 Gitee/GitHub/GitLab，其中一个托管平台，进入 微信云托管服务管理->服务列表->流水线->新建流水线 如代码权限未授权或授权过期，请先完成授权后在进行创建流水线 [图片] 添加成功后，点击开始流水线即可触发部署，也可以通过勾选推送触发进，代码推送到指定仓库时将会触发流水线进行代码部署 [图片] Tips: 由于当前模版有使用到数据库，如使用流水线触发,需将环境变量配置到container.config.json { "containerPort": 80, "dockerfilePath": "Dockerfile", "buildDir": "", "minNum": 0, "maxNum": 10, "cpu": 1, "mem": 2, "policyType": "cpu", "policyThreshold": 80, "envParams": { "MYSQL_ADDRESS": "地址", "MYSQL_PASSWORD": "密码", "MYSQL_USERNAME": "用户名" }, "customLogs": "stdout", "initialDelaySeconds": 2, "dataBaseName": "nodejs_demo", "executeSQLs": [ "CREATE DATABASE IF NOT EXISTS nodejs_demo;", "USE nodejs_demo;" ] } 第 5 步：编写小程序端代码小程序基础库版本最低要求为2.21.1const { socketTask } = await wx.cloud.connectContainer({ config: { env: '', // 替换自己的微信云托管的环境ID }, service: '', // 替换自己的服务名 path:'/' }) socketTask.onMessage(function (res) { console.log('【WEBSOCKET】', res.data) }) socketTask.onOpen(function (res) { console.log('【WEBSOCKET】', '链接成功！') setTimeout(() => { socketTask.send({ data: '这是小程序消息' }) }, 5000); }) socketTask.onClose(function (res) { console.log('【WEBSOCKET】链接关闭！') }) 第 6 步：开始调试打开公网访问链接进行调试： [图片] 第 7 步：调试结果现在可以看到在 web 中使用计数器模版每次点击将会实时传送到小程序中,到该步骤通过微信云托管提供的 WebSocket 新能力,实现了实时消息推送： [图片] 三、总结以上便是微信云托管新能力「WebSocket」，基于此新能力可以延伸很多有趣的应用，例如线上聊天室、协同文档、消息推送等等，加上云托管的一些其他特性，值得体验！ 作者：Life，云开发、云托管高级布道师。前端开发工程师，熟悉React、Node.js，在小程序、云开发方面有深入研究，通过云开发、云托管开发多套商用小程序，《小程序·云开发实战智慧衣橱小程序》直播课讲师。 [图片]

一、哪种行为或内容不应在朋友圈出现？ 我们鼓励用户自发地分享所见所闻，但反对所有违反《微信外部链接内容管理规范》的内容或行为。 二、如果我的链接违反了《微信外部链接内容管理规范》将会被怎样处理？ 对于违反《微信外部链接内容管理规范》的内容，一经发现将立即进行处理，包括但不限于停止链接内容在朋友圈继续传播、停止对相关域名或IP地址进行访问、屏蔽相关链接等。 由微信公众平台或开放平台帐号施行或者发起的，一经查实，前述帐号、主体也将按照微信相关规则进行处罚，包括但不限于限制或禁止使用部分或全部功能、帐号封禁直至注销等，并公告处理结果；微信也有权依照本规范及相关协议、专项规则的规定，拒绝再向前述主体提供服务。 三、我的链接被禁止在微信访问，如何才能恢复正常访问？ [图片]注： 1、链接的封禁时间将根据链接的累计违规次数（最近半年）来判定。被禁止访问的链接若不发起解封申请，将不予解封。若出现解封申请的数量过多，审核团队无法较快处理的情况，对于超出封禁时间的链接，审核通过后立即解封。 2、首次违规的链接修改完可申请解封，经平台评估符合规范的链接可申请解除处理，第二次封禁12小时，第三次封禁一天，第四次及以上封禁一周。之后若未修改完成不予解封。对于重复、情节严重或多次违规的行为，平台将视具体情节采取不同程度的阶梯处罚措施。 四、我的链接在朋友圈分享了之后仅自己可见，怎么办？ 1、若此域名未在工信部ICP备案，分享频率会受到限制，请先完成备案。点击这里了解详情。 2、请根据《微信外部链接内容管理规范》检查该页面所用的域名、IP地址下是否存在违规内容。若存在，请修改页面内容。 3、确认域名、IP地址不存在违规内容，可以通过电子邮件发送至腾讯指定邮箱：moment@tencent.com进行反馈。 邮件标题请采用如下格式： 【链接解封反馈】“反馈人或企业” + “页面主题” 正文请附上仅自己可见的链接以及情况说明。 Q：公众号发的图文消息是否受影响？ A：微信公众号图文消息的域名是已备案域名：qq.com。因此，公众号推送的图文消息不受频率限制的影响。   Q：未备案域名分享频率是否会受到限制？ A：未备案的一级域名每天分享至朋友圈的次数将有限制。   Q：不备案会出现什么情况？ A：未备案域名，分享达一定次数后，再分享将仅自己可见。    Q：公众号阅读原文或编辑文案中插入了网址需要备案吗？ A：阅读原文或文中插入的网址没有强制备案要求。若用户点击此网址后并将其分享到朋友圈，需遵循备案要求。   Q：为何个别域名已经备案了，在朋友圈还是分享仅自己可见？ A：可查看该域名是否违反了《微信外部链接内容管理规范》，具体可点击查看：朋友圈管理常见问题 五、如果我的应用被禁止在朋友圈分享，如何才能解封？ 1、请根据《微信外部链接内容管理规范》检查应用是否存在违规内容，若存在，请进行修改。 2、修改后，可以通过电子邮件发送至腾讯指定邮箱：moment@tencent.com申请解封。 注：若公众帐号功能被封禁，请按公众平台的相应提示等待解封，目前此邮箱（moment@tencent.com）不接受公众帐号解封申请。 邮件标题请采用如下格式： 【应用解封反馈】“反馈人或企业” + “应用名称” 正文请附上开放平台应用appid和分享链接，以及情况说明。 六、如果我的链接因被他人恶意利用生成违规内容而限制在微信内分享，怎么办？ 1.点击“申请恢复访问”按钮，跳转“更多信息页”查看具体被恶意利用的链接； 2.根据违规链接核实被注入情况，修复漏洞，清理违规内容。（腾讯安全应急响应中心博客：xss漏洞解决方案https://security.tencent.com/index.php/blog/msg/53） 3.确认漏洞彻底修复后，提交解封申请。 被注入页面违规内容样式示例： [图片]

记录从零开始学小程序的过程，还有很多需要学习的东西，这个案例会持续更新

背景 我们发现大部分小程序都会使用 [代码]wx.getUserInfo[代码] 接口，来获取用户信息。原本设计这个接口时，我们希望开发者在真正需要用户信息的情况下才去调取这个接口，但很多开发者会直接调用这个接口，导致用户在使用小程序的时候产生困扰，归结起来有几点： 开发者在小程序首页直接调用 [代码]wx.getUserInfo[代码] 进行授权，弹框获取用户信息，会使得一部分用户点击“拒绝”按钮。 在开发者没有处理用户拒绝弹框的情况下，用户必须授权头像昵称等信息才能继续使用小程序，会导致某些用户放弃使用该小程序。 用户没有很好的方式重新授权，尽管我们增加了[代码]设置[代码]页面，可以让用户选择重新授权，但很多用户并不知道可以这么操作。 此外，我们发现开发者默认将 [代码]wx.login[代码] 和 [代码]wx.getUserInfo[代码] 绑定使用，这个是由于我们一开始的设计缺陷和实例代码导致的（[代码]wx.getUserInfo[代码] 必须通过 [代码]wx.login[代码] 在后台生成 [代码]session_key[代码]后才能调用）。同时，我们收到开发者的反馈，希望用户进入小程序首页便能获取到用户的 [代码]unionId[代码]，以便识别到用户是否以前关注了同主体公众号或使用过同主体的App 。 为了解决以上问题，针对获取用户信息我们更新了三个能力： 1.使用组件来获取用户信息 2.若用户满足一定条件，则可以用[代码]wx.login[代码] 获取到的[代码]code[代码]直接换到[代码]unionId[代码] 3.[代码]wx.getUserInfo[代码] 不需要依赖 [代码]wx.login[代码] 就能调用得到数据 获取用户信息组件介绍 [代码][代码] 组件变化： [代码]open-type [代码]属性增加 [代码]getUserInfo[代码] ：用户点击时候会触发 [代码]bindgetuserinfo[代码] 事件。 新增事件 [代码]bindgetuserinfo[代码] ：当 [代码]open-type[代码]为 [代码]getUserInfo[代码] 时，用户点击会触发。可以从事件返回参数的 [代码]detail[代码] 字段中获取到和 [代码]wx.getUserInfo[代码] 返回参数相同的数据。 示例： [代码]<button open-type="getUserInfo" bindgetuserinfo="userInfoHandler"> Click me button>[代码]和 [代码]wx.getUserInfo[代码] 不同之处在于： 1.API [代码]wx.getUserInfo[代码] 只会弹一次框，用户拒绝授权之后，再次调用将不会弹框； 2.组件 [代码][代码][代码][代码] 由于是用户主动触发，不受弹框次数限制，只要用户没有授权，都会再次弹框。 通过获取用户信息的组件，就可以解决用户再次授权的问题。 直接获取unionId开发者申请 [代码]userinfo[代码] 授权主要为了获取 [代码]unionid[代码]，我们鼓励开发者在不骚扰用户的情况下合理获得[代码]unionid[代码]，而仅在必要时才向用户弹窗申请使用昵称头像。为此，凡使用“获取用户信息组件”获取用户昵称头像的小程序，在满足以下全部条件时，将可以静默获得 [代码]unionid[代码]： 1.在微信开放平台下存在同主体的App、公众号、小程序。 2.用户关注了某个相同主体公众号，或曾经在某个相同主体App、公众号上进行过微信登录授权。 这样可让其他同主体的App、公众号、小程序的开发者快速获得已有用户的数据。 不依赖登录的用户信息获取某些工具类的轻量小程序不需要登录行为，但是也想获取用户信息，那么就可以在 [代码]wx.getUserInfo[代码] 的时候加一个参数 [代码]withCredentials: false[代码] 直接获取到用户信息，可以少一次网络请求。 这样可以在不给用户弹窗授权的情况下直接展示用户的信息。 最佳实践 1.调用 [代码]wx.login[代码] 获取 [代码]code[代码]，然后从微信后端换取到 [代码]session_key[代码]，用于解密 [代码]getUserInfo[代码]返回的敏感数据。 2.使用 [代码]wx.getSetting[代码] 获取用户的授权情况  1) 如果用户已经授权，直接调用 API [代码]wx.getUserInfo[代码] 获取用户最新的信息；  2) 用户未授权，在界面中显示一个按钮提示用户登入，当用户点击并授权后就获取到用户的最新信息。 3.获取到用户数据后可以进行展示或者发送给自己的后端。 One More Thing 除了获取用户方案介绍之外，再聊一聊很多初次接触微信小程序的开发者所不容易理解的一些概念： 1.关于OpenId和UnionId [代码]OpenId[代码] 是一个用户对于一个小程序／公众号的标识，开发者可以通过这个标识识别出用户。 [代码]UnionId[代码] 是一个用户对于同主体微信小程序／公众号／APP的标识，开发者需要在微信开放平台下绑定相同账号的主体。开发者可通过[代码]UnionId[代码]，实现多个小程序、公众号、甚至APP 之间的数据互通了。 同一个用户的这两个 ID 对于同一个小程序来说是永久不变的，就算用户删了小程序，下次用户进入小程序，开发者依旧可以通过后台的记录标识出来。 2.关于 getUserInfo 和 login 很多开发者会把 [代码]login[代码] 和 [代码]getUserInfo[代码] 捆绑调用当成登录使用，其实 [代码]login[代码] 已经可以完成登录，[代码]getUserInfo[代码] 只是获取额外的用户信息。 在 [代码]login[代码] 获取到 [代码]code[代码] 后，会发送到开发者后端，开发者后端通过接口去微信后端换取到 [代码]openid[代码] 和[代码]sessionKey[代码]（现在会将 [代码]unionid[代码] 也一并返回）后，把自定义登录态 [代码]3rd_session[代码]返回给前端，就已经完成登录行为了。而 [代码]login[代码] 行为是静默，不必授权的，用户不会察觉。 [代码]getUserInfo[代码] 只是为了提供更优质的服务而存在，比如展示头像昵称，判断性别，开发者可通过 [代码]unionId[代码] 和其他公众号上已有的用户画像结合来提供历史数据。因此开发者不必在用户刚刚进入小程序的时候就强制要求授权。 可以在官方的文档中看到 [代码]login[代码] 的最佳实践： [图片] Q & A Q1: 为什么 login 的时候不直接返回 openid，而是要用这么复杂的方式来经过后台好几层处理之后才能拿到？ A: 为了防止坏人在网络链路上做手脚，所以小程序端请求开发者服务器的的请求都需要二次验证才是可信的。因为我们采取了小程序端只给 [代码]code[代码] ，由服务器端拿着 [代码]code[代码] 和 [代码]AppSecrect[代码] 去微信服务器请求的方式，才会给到开发者对应的[代码]openId[代码] 和用于加解密的 [代码]session_key。[代码] Q2: 既然用户的[代码]openId[代码] 是永远不变的，那么开发者可以使用[代码]openId[代码] 作为用户的登录态么？ A: 不行，这是非常危险的行为。因为 [代码]openId[代码] 是不变的，如果有坏人拿着别人的 [代码]openId[代码] 来进行请求，那么就会出现冒充的情况。所以我们建议开发者可以自己在后台生成一个拥有有效期的 [代码]第三方session[代码] 来做登录态，用户每隔一段时间都需要进行更新以保障数据的安全性。 Q3: 是不是用户每次打开小程序都需要重新[代码]login[代码]？ A: 不必，可以将登录态存入[代码]storage[代码]中，用户再次登录就可以拿[代码]storage[代码] 里的登录态做正常的业务请求，只有当登录态过期了之后才需要重新[代码]login[代码] 。这样子做一则可以减少用户等待时间，二则可以减少网络带宽。 目前微信的[代码]session_key[代码] 有效期是三天，所以建议开发者设置的登录态有效期要小于这个值。