扫描二维码进入小程序超详细过程

项目场景：

提示：这里简述项目相关背景：二维码中的参数是文章的id。在微信公众号相关的配置在这就不说明了。
假设配置完成域名为:http://xiaobai.com?id=${id}。
下面主要讲述小程序方面的代码编写。

需求: 通过扫描二维码进入小程序的文章详情detail页面，首先判断用户之前是否登录过小程序，如果没有登录过则跳到登录login页面进行登录，登录成功后返回到文章详情detail页面；如果已经登录则直接通过接口查看文章详情。

问题分析：

一、当我们扫码二维码进入文章详情页面时，假设用户没有登录，跳转到登录login页面，登录成功后需要判断跳转到程序首页还是文章详情页面
二、登录成功后再次返回文章详情页面时，在onload函数中获取不到之前扫码进入小程序的参数文章id

解决方案：

在跳转登录页面时，将参数id存入缓存，给登录login页面传递一个标识flag,表示我们是从文章详情进入,登录成功后还需要返回到文章详情

文章详情页面detail.js

onLoad: function (options) {
	// 通过获取 token 判断用户是否登录过小程序
    let token = wx.getStorageSync('Token')
    let id = token && wx.getStorageSync('id') 
    // id存在说明是从扫描二维码进入,但用户没有登录
    if(id){
    // 将缓存中的 文章id 清除
      wx.removeStorageSync('id')
    //TODO 在这里调获取文章详情的接口
      
    }else{  
        // 说明扫码进入
        // url为配置的域名, 通过字符串切割的方法获取参数id
        let url = decodeURIComponent(options.q)
        let id = url.split('=')[1]
        // 说明登录过小程序
        if(token){
          //TODO 在这里调获取文章详情的接口
         
        }else{
          // 说明没有登录过小程序
          // 将参数id放进缓存，等登录成功返回此页面时用来获取文章详情
          wx.setStorageSync('id',id)
          wx.navigateTo({
            url: '/pages/login/login?flag=1',
          })
        }
   	}
  },

登录页面login.js

Page({
  data: {
    ifFlag:false, // 判断是否从文章详情页面进入
  },
  onLoad: function (options) {
  	// 获取flag标识
	const flag = options.flag ? true : false
	this.setData({flag})
  }
  // 登录函数
  submit(){
  // TODO 登录成功后我们只需要判断flag
  	if(flag)  // 跳到文章详情页面
  	else 	  // 正常跳到程序首页
  }
})

总结

文章来源地址https://uudwc.com/A/GMxG