关于vue.js:关于扫普通链接二维码打开小程序

6次阅读

共计 1682 个字符，预计需要花费 5 分钟才能阅读完成。

先依照官网文档走一遍设置流程扫一般链接二维码关上小程序

这里次要讲一下怎么设置链接二维码的规定

二维码跳转规定
留神：从 2017 年 5 月开始，微信客户端反对二维码规定依据“子门路匹配”。如原有二维码链接为 http://www.qq.com/a/123456，其中 12345 为业务参数，则可配置规定 http://www.qq.com/a/ 实现扫码关上小程序。

微信客户端扫码将按以下匹配规定管制跳转：

二维码链接的协定、域名与已配置的二维码规定统一。
二维码链接属于后盾配置的二维码规定的子门路。（如需反对子门路匹配，请确认后盾配置的二维码规定以 / 结尾）
如果二维码规定蕴含参数，链接? 后为参数局部，参数要求前缀匹配。

如果不带参数
- 指定某个页面，就间接把页面门路配置下来就行。比如说咱们要拜访的页面地址是http://www.qq.com/a，那就间接配置http://www.qq.com/a。
- 如果说咱们想间接匹配 http://www.qq.com 下的所有页面（不带参数），则设置为 http://www.qq.com/，参考规定 - 如需反对子门路匹配，请确认后盾配置的二维码规定以 / 结尾
带参数
理论我的项目中，咱们往往会在二维码的链接上带各种各样的参数，有时候还会是动静的，如果说咱们当初二维码上的链接是 http://www.qq.com/mypath?a=1&b=2&other=else，并且这个参数是动静的，就是 a /b/other 的值会变动。
那么依据 前缀匹配 规定，那就能够设置成 http://www.qq.com/mypath?。
这样不论实际上链接前面带什么参数都能够匹配上咱们在后盾设置的二维码规定了！

这里顺便看下咱们我的项目中的理论利用

<template>
  <-- 所有 webview 都共用这个页面，扭转 src 的值就行 -->
  <web-view v-if="pageUrl" :src="pageUrl"></web-view>
</template>

<script>
export default {data() {
    return {
      pageUrl: null,
      params: {}};
  },

  onLoad(query) {this.params = query},
  onShow() {this.init(this.params)
  },
  methods: {async init({ q}) {if(this.pageUrl) { // 刷新页面
        this.pageUrl = ''
        await new Promise((resolve) => {setTimeout(() => {resolve()
          }, 100)
        })
      }

      const token = uni.getStorageSync("USER_TOKEN"); // 用户 token

      if(q) {const urlPath = decodeURIComponent(q) // 获取到二维码原始链接内容
        const flag = /\?\w+=\w+/g.test(urlPath) ? "&" : "?";
        this.pageUrl = `${urlPath}${flag}&token=${token}`
        console.log("urlPath=======", this.pageUrl);
        return
      }
    }
  }
};
</script>

在后盾设置好了二维码规定之后，怎么测试呢？

填写测试链接
咱们设置二维码规定的时候，会要求咱们填写测试链接！之前不晓得这个填写了有什么用，原来就是用来测试的 orz。

这个填写的测试链接，就是能够用来测试的二维码链接。也就是你扫的二维码的链接内容必须是这里填写的测试链接，咱们能力调起体验版（如果抉择了测试范畴是体验版的话）的小程序，否则会间接调起线上版的小程序。
不晓得是不是咱们了解不正确，如果真是这样子的话好不不便啊，感觉每测试一个二维码，就得把二维码的链接填写到后盾的这个测试链接下来，不然调起的就是线上版小程序。这里如果了解不对，还望晓得的大佬告知下，谢谢！
公布规定
公布下面填写的一系列设置的规定。下面如果咱们抉择了测试范畴是体验版，那咱们就要公布。
提交体验版
就能够测试啦。

正文完