微信扫码进入小程序特定页面

小程序配置 开发 - 开发管理 - 开发设置-普通链接二维码打开小程序

配置好的截图 如下:二维码规则建议是自己的域名 + /mini/

功能页面 pages/index/index 是为了方便跳转其他页面

记得把校验文件发给后端

web 端处理

二维码格式为:二维码规则/功能页/你想跳转的页面

js 复制代码
// isFlag 是否携带地址
export default function getQrCode(url, isFlag = true) {
  // url为小程序跳转路由(带参) e.g:subPackages/pages/buildDetail/index?id=7B8349BD29EB4957B19DACD8C98807B3

  if (isFlag) {
    let webLocation = localStorage.getItem("location") || "";
    return `二维码规则/pages/index/index/webUrl=${encodeURIComponent(
      url
    )}&webLocation=${encodeURIComponent(webLocation)}`;
  } else {
    return `二维码规则/mini/pages/index/index/webUrl=${encodeURIComponent(
      url
    )}`;
  }
}
// 这儿我用的vue-qrCode  生成的二维码
  mounted() {
    let url = "pages/houseList/index?tabIndex=2";
    this.$nextTick(() => {
      this.qrcode = new QRCode(this.$refs.qrCode, {
        text: this.getQrCode(url),
        width: 126,
        height: 126,
        colorDark: "#000000",
        colorLight: "#ffffff",
        correctLevel: QRCode.CorrectLevel.Q,
      });
    });
  },

小程序处理 这儿自己看着的参数处理:我这儿的解码思路是 判断有无地址,无地址 就那webUrl后面的数据 有地址 在分割 分别赋值

js 复制代码
  onLoad: function (options) {
   if (options && options.q) {
      // 从普通二维码扫码进入
      let par = options && options.q && decodeURIComponent(options.q).split('二维码规则/pages/index/index/webUrl=')[1]
      let url = this.decodeURIFunc(par),
        location = ''
      if (decodeURIComponent(par).includes('webLocation')) {
        url = this.decodeURIFunc(decodeURIComponent(par).split('&webLocation=')[0]),
          location = decodeURIComponent(par).split('&webLocation=')[1]
        wx.setStorageSync('cityCode', location)
        wx.setStorageSync('localtion', JSON.parse(location).location)
      }
      // 这儿的/ 不能丢哦
      wx.navigateTo({
        url: '/' + url,
      })
    }

}

// 处理解码后 / ? = 无法解码问题
  decodeURIFunc(val) {
    return val.replace(/%2F/g, '/').replace(/%3F/g, '?').replace(/%3D/g, '=')
  },
相关推荐
万岳科技系统开发2 小时前
私域直播小程序源码的整体架构设计与实现思路
学习·小程序
汤姆yu3 小时前
基于微信小程序的驾校预约与学习系统
学习·小程序·驾校预约
speedoooo5 小时前
未来的App不再需要菜单栏?
前端·ui·容器·小程序·web app
猿究院_xyz5 小时前
微信小程序与echarts联动安卓真机测试出现黑色阴影
前端·javascript·微信小程序·小程序·echarts
说私域6 小时前
不同类型企业构建私域流量的必要性及定制开发AI智能名片商城小程序的应用
大数据·人工智能·小程序
老华带你飞7 小时前
健身房预约|基于springboot 健身房预约小程序系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·后端·小程序
2501_915909067 小时前
苹果应用加密方案的一种方法,在没有源码的前提下,如何处理 IPA 的安全问题
android·安全·ios·小程序·uni-app·iphone·webview
2501_915909068 小时前
iOS 项目中常被忽略的 Bundle ID 管理问题
android·ios·小程序·https·uni-app·iphone·webview
2501_915921438 小时前
iOS App 测试的工程化实践,多工具协同的一些尝试
android·ios·小程序·https·uni-app·iphone·webview
TE-茶叶蛋8 小时前
UnoCSS 集成指南 - 小程序适配原理
小程序