微信公众号网页开发

基本配置

2.开发—基本配置

发者ID(AppID) 开发者密码(AppSecret)

3.IP白名单配置

填写当前本地开发IP地址和服务器IP地址

开发

jQuery + rem + flex或WeUi、SUI(阿里巴巴共享业务事业部SDC团队(UED))、Mint-UI(饿了么)开发页面 <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">

1.引入JS文件

2通过config接口注入权限验证配置

第一步GET请求access_token

access_token的有效期为7200秒(不必反复请求)

    grant_type是获取access_token填写client_credential appid是第三方用户唯一凭证 secret是第三方用户唯一凭证密钥,即appsecret**

第二步GET请求jsapi_ticket

jsapi_ticket的有效期为7200秒(不必反复请求) 用第一步获取到的access_token的值进行请求

第三步生成算法签名

const timestamp = parseInt(Date.now() / 1000) //生成签名的时间戳 const nonceStr = Math.random().toString(36).substr(2, 15) //生成签名的随机串 let jsapi_ticket //在第二步生成 let url//签名用的url必须是调用JS接口页面的完整URL(前端请求服务端接口带入)

const sha1 = require(sha1)//这里需要引入一个插件npm install sha1

router.get(/, (req, res, next) => {

const url = decodeURIComponent(req.query.url)//这里的url采用前端加密,后端解密的形式获取
const timestamp = parseInt(Date.now() / 1000)
const nonceStr = Math.random().toString(36).substr(2, 15)
let jsapi_ticket = "在第二步拿到了"

const params = {
        nonceStr,
        jsapi_ticket,
        timestamp,
        url
    }
    const string = Object.keys(params).sort().map(key => `${key.toLowerCase()}=${params[key]}`).join(&)
    const signature = sha1(string)//生成的签名
    
    res.status(200).json({//将参数返回给前端
        timestamp,
        signature,
        nonceStr
    });
    
    })


module.exports = router;

3前端静态页面实际调用

经验分享 程序员 微信小程序 职场和发展