微信小程式掃碼解析小程式碼

樑雨季發表於2020-08-13

通過微信掃小程式碼,跳轉到應用小程式內, 如何解析小程式碼的引數呢?

一般小程式碼會跳轉到設定的頁面,如首頁, 可以直接跳轉到小程式首頁,然後解析小程式攜帶的引數,再開啟某個頁面。

(小程式碼的路徑要線上版本存在的路徑)

 

如:商品詳情分享碼 -> 使用者掃碼 -> 開啟小程式頁面(如首頁)-> 解析碼引數 ->開啟商品詳情

為啥不直接跳轉到商品詳情頁呢?這當然是可以的,但我們要在首頁完成初始化使用者資訊,所以選首頁,載入完首頁再跳轉,提高首頁曝光率,哈。

碼攜帶引數和頁面得到連結的引數為 options.scene掃碼進入的連結都是轉碼的,

需要進行轉碼  =>  var url = decodeURIComponent(options.scene);

scene是後臺生成小程式碼攜帶的引數,也可以命名為其他的,如q等,對應解析即可

 

 

這是我的解析:

parseScene(scene) {         

  var params = new Object(); // var params = {};也行        

   var scene = decodeURIComponent(scene).split('&');       

    for (var i = 0; i < scene.length; i++) {          

       params[scene[i].split('=')[0]] = scene[i].split('=')[1];    

       }         

   let args = JSON.stringify(params);     

      wx.navigateTo({url: `/shop/pages/detail/detail?args=${args}`});

 },

碼攜帶引數:我們需要轉碼

scene=u%3D11960%26g%3D2928%26s%3D298%26grp%3D0

 

%3D 為 = ;%26為 &;

 

通過解析後得到引數

{u: "11960", g: "2928", s: "298", grp: "0"} 

 

 

如何進行工具除錯?

 

1.拿到小程式碼後可以通過工具的二維碼編譯

 

 2. 可以模擬引數編譯

 

 這樣這個就會解析到/pages/index/index的路徑下,通過onLoad: function (e) {}捕獲引數!

 

首頁解析完之後就可跳轉到分享頁(商品詳情頁)

let args = JSON.stringify(params);     

wx.navigateTo({url: `/shop/pages/detail/detail?args=${args}`});

解析出來的個物件,如上圖,根據得到的引數就行跳轉!

 

好了,掃碼就可以!!

祝你好運!

 

宣告:以上的是我個人的總結,由於知識面的不同,難免有疏漏,希望提出疑問!

相關文章