跳到主要内容

微信小程序实战面经

实战高频考点​

1. 登录与鉴权完整流程​

前端 wx.login() → 获取 code
    ↓
发送 code 到自己的后端
    ↓
后端调用微信接口：code2Session
    → 返回 openid + session_key + unionid
    ↓
后端生成自定义 token，存 Redis
    ↓
前端存 token 到 storage，后续请求携带

常见问题

  • session_key 有有效期，需定期调用 checkSession 验证
  • wx.getUserInfo 已废弃，用 wx.getUserProfile（需用户触发）
  • unionid 需满足：已关联公众号/小程序，或绑定开放平台

2. 支付流程​

1. 前端发起支付请求到自己后端
2. 后端调用微信统一下单接口 → 返回 prepay_id
3. 后端用 prepay_id 签名生成支付参数
4. 前端调用 wx.requestPayment({ timeStamp, nonceStr, package, signType, paySign })
5. 用户支付完成 → 微信回调后端 → 后端更新订单状态
6. 前端 success 回调只做提示，不以此为支付成功依据（以后端通知为准）

3. 自定义组件高级用法​

behaviors（类似 mixins）

const loginBehavior = Behavior({
  data: { isLogin: false },
  methods: {
    checkLogin() { /* ... */ }
  },
  lifetimes: { attached() { this.checkLogin() } }
})

Component({
  behaviors: [loginBehavior],
  // 自动拥有 loginBehavior 的数据和方法
})

抽象节点（类似 slot 的高阶用法）

{ "componentGenerics": { "selectable": { "default": "./default-item" } } }

4. 小程序云开发​

  • 云函数：Node.js 环境，免鉴权调用微信 API，自动获取 openid
  • 云数据库：文档型数据库，支持实时监听
  • 云存储：文件上传下载，wx.cloud.uploadFile
  • 云调用：云函数中调用微信开放能力（发送订阅消息等）
// 云函数端
exports.main = async (event, context) => {
  const { openid } = context.OPENID // 自动获取，无需手动传
  return db.collection('users').where({ _openid: openid }).get()
}

5. 分包策略详解​

{
  "subpackages": [
    { "root": "packageA", "pages": ["pages/cat", "pages/dog"] },
    { "root": "packageB", "pages": ["pages/apple"] }
  ],
  "preloadRule": {
    "pages/index": { "network": "all", "packages": ["packageA"] }
  }
}
  • 独立分包：可不依赖主包运行（分享页、广告页）
  • 分包预加载：用户在某页面时提前加载指定分包

6. 调试与发布​

  • vconsole：小程序内置调试面板，wx.setEnableDebug({ enableDebug: true })
  • 抓包：Charles/Whistle 配合代理，需在微信开发者工具开启
  • 体验版/预览版：真机测试不经过审核
  • 灰度发布：后台配置按比例放量

7. 高频面试题​

  • 小程序如何做埋点？ 封装统一 Page/Component，重写 onShow/tap 等生命周期
  • 如何实现全局错误监控？ App.onError + wx.onError 捕获未处理异常
  • 小程序能访问 cookie 吗？ 不能，用 wx.setStorageSync 替代
  • 如何做长连接？ wx.connectSocket WebSocket API
  • 页面间传参的方式？ URL 参数、globalData、EventBus、本地存储