微信小程式掃碼進入小程式引數問題
阿新 • • 發佈:2022-05-12
需求:掃描二維碼進入小程式的詳情頁面,目錄頁面,頁面請求都需要帶上引數及需要驗證使用者授權。
既然是掃碼進入的,那麼我第一反應肯定是在請求攔截裡做操作了,不然如何判斷他是什麼怎麼進來的。一進入頁面,肯定會有請求,我先呼叫一下wx.getLaunchOptionsSync()獲取當前的場景值,看看他是怎麼進來的。如果是掃碼進來的, 我要記錄起當前的url以及query引數。
// 獲取場景URL let jumpUrl = '' // 獲取場景ID const option = wx.getLaunchOptionsSync() // 1011 二維碼 1012 長按圖片識別 1013 掃描相簿二維碼 if(option.scene === 1011 || option.scene === 1012 || option.scene === 1013 || option.scene === 1047 || option.scene === 1048 || option.scene === 1049) { if(JSON.stringify(option.query) !== '{}') { jumpUrl = encodeURIComponent(`/${option.path}?${decodeURIComponent(option.query.scene)}`) } }
這裡有兩個注意的點:
1、option.query.scene 獲取的引數需要用decodeURIComponent解碼,解碼出來的值是跟你自己寫的引數會不一樣的。
比如:一般你頁面傳值的url是: '/pages/detail/detail?id=3', 解碼出來後的引數是'/pages/detail/detail?id=7627a3dc69a88c7t'這種格式,解碼出這個之後,就拿這個去試試能否請求成功。
2、因為頁面需要授權,你要把記錄的連結帶到登入頁 '/pages/detail/detail?id=7627a3dc69a88c7t'去授權。如果直接帶過去,會出現引數丟失問題,所以需要encodeURIComponent()
然後就可以帶到登入頁去了:
wx.reLaunch({ url: '/pages/login/login?redirect=' + jumpUrl, })
接下來就是獲取引數的問題。
登入頁獲取引數,需要解碼
onLoad: function (options) { // 獲取url if(options.redirect) { const url = decodeURIComponent(options.redirect) console.log('url', url) // 授權完成後跳轉回去 this.setData({ redirect: url }) } }
詳情頁的引數
因為掃碼進來的連結是這樣的
'/pages/detail/detail?scene=id=7627a3dc69a88c7t',所以在解碼之後,還需要對scene做操作,有scene時,說明是掃碼進來的,沒有時,說明是頁面跳進來的
onLoad(options) {
let scene = decodeURIComponent(options.scene)
let id = scene !== 'undefined' ? scene.split('=')[1] : options.id
},
完。