天天看點

普通二維碼跳轉微信小程式

去微信公衆平台,在開發那裡的開發管理-》開發設定,下拉到“掃普通連結二維碼打開小程式”。如下圖:

普通二維碼跳轉微信小程式

然後添加配置,如下圖:

二維碼規則要寫自己伺服器的域名+字首,一般建議字首是其他地方沒用到的。下面的test.cn/miniProgram是我随便寫的域名。

小程式功能頁面指掃碼跳轉後的小程式的頁面

注意:需要把校驗檔案放到域名的根目錄下才能添加成功

普通二維碼跳轉微信小程式

釋出

設定成功後便需要釋出

如果小程式還沒上線過,是不允許釋出的。隻能先上線,才能測試關于這塊的功能。可以先上線,然後關掉小程式的被搜尋選項

普通二維碼跳轉微信小程式

測試二維碼跳轉

去草料二維碼生成一個二維碼。id=1&name=test是攜帶的參數

普通二維碼跳轉微信小程式

參數問題

掃碼進去參數是不一樣的,掃碼進去的參數被做了encodeURIComponent處理并且放在q裡面,再傳過來。如下:

{
    q:"https%3A%2F%2Ftest.cn%2FminiProgram%3Fid%3D1%26name%3Dtest",
    scancode_time:"1618969967"//掃碼的時間
}
           

擷取參數的代碼如下:由于我用的是mpvue,寫的是vue的寫法,微信小程式原生的話需要你們根據需要自己修改

data () {
  return {
    options: {}    
  }
},
methods: {
  ...

  // 擷取url裡傳回的參數
  parseUrl (url) {
    var query = {} // 存儲參數
    try {
      if (url.indexOf('?') >= 0) {
        url = url.split('?')[1].split('&')
      } else {
        query = null
        return query
      }

      var params = url

      for (var i = 0; i < params.length; i++) {
        var param = params[i].split('=')
        query[param[0]] = decodeURIComponent(param[1])
      }
    } catch (error) {
      console.warn('解析url參數失敗', error)
    }
    return query
  },
  
  ...
},

onLoad (options) {
  // 掃碼進去的
  if (options.q) {
    let scene = decodeURIComponent(options.q)  // 使用decodeURIComponent解析  擷取目前二維碼的網址
    this.options = this.parseUrl(scene)
  } else {
    this.options = options || {}

  }
}
           

繼續閱讀