记录一次年前三天紧急上线一个小程序过程

背景

去年年末，离过年的时间还剩几天，产品部的突然跑过来问能不能年前做完然后上线一个小程序，利用过年的流量，引流一波。

时间紧，任务急。并且公司还在开源节流，精简服务器。这个项目也就过年这段时间跑跑的，过后就是废弃状态。综合种种，于是提出试试小程序的云开发。

小程序云开发优势

无需搭建服务器，快速构建小程序，免登录、免鉴权调用微信开放服务，按量计费,还有内容管理（CMS）,小项目用云开发在适合不过了。

这个项目除了正常的展示外，还用到以下功能

1. 静态网站 H5 跳小程序任意页面
2. 客服消息自动回复
3. 订阅消息推送

以上结合小程序云开发不用后台参与进来，前端也能很容易的实现起来。

先看看大家比较关心的费用问题

左边是费用，右边是访问人数，
可以看到每天大概800-1000人数的访问，费用也就几分钱，这还是在开通了内容管理（CMS）情况下的数据。所以对于费用这一块完全可以打消这个顾虑

静态网站 H5 跳小程序任意页面

老规矩先看文档 https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/staticstorage/jump-miniprogram.html
能力
可以在微信内部浏览器的 H5 跳转小程序，也可以在微信外部浏览器或其他部分 App （如企业微信、QQ 等）跳转微信小程序。
根据文档我这里改成了可以跳首页以及任意详情页面

H5页面

  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  



  

    

      
正在打开 “你的小程序名称”...
 
      
        
        打开小程序
      
    
    

      
点击以下按钮打开 “你的小程序名称”
 
      
      

      
    
    

      
请在手机打开网页链接
    
  

云函数

// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init({
  env: 'id'
})

// 云函数入口函数
exports.main = async (event, context) => {
  const wxContext = cloud.getWXContext()

  switch (event.action) {
    case 'getUrlScheme': {
      return getUrlScheme(event)
    }
  }

  return 'action not found'
}

async function getUrlScheme(event) {
  let path = '/pages/index/index'
  let query = ''
  if (event.id) {
    path = '/pages/detail/index'
    query = 'id=' + event.id
  }
  return cloud.openapi.urlscheme.generate({
    jumpWxa: {
      path: path, // 
      query: query,
    },
    // 如果想不过期则置为 false，并可以存到数据库
    isExpire: false,
    // 一分钟有效期
    expireTime: parseInt(Date.now() / 1000 + 60),
  })
}

把云函数部署上去，静态H5页面上传到云开发的静态网站里

在网站配置里找到域名，就可以H5跳小程序了。

效果预览

这里放个官方的栗子
https://postpay-2g5hm2oxbbb721a4-1258211818.tcloudbaseapp.com/jump-mp.html

其他的下期再来肝

换工作？找面试题？ 来前端面试题库 wx搜索 进阶的大前端