vue開發微信公眾號小技巧(易除錯環境)
阿新 • • 發佈:2018-11-17
本主要對 在開發微信公眾號時,遇到的一些問題進行總結 使用(vue)哦~
除錯微信公眾號
大家在本地環境開發的時候,修改樣式,及除錯介面一遍又一遍的在微信開發者工具上開啟,因為在我們本地瀏覽器是打不開微信的頁面的,或者每次更改一個細節就發一遍測試環境,非常耗時影響開發,這時~~~~
小技巧來嘍
先在全域性變數中將我們的環境分為三種
- dev 本地 bing bing
- test 測試
- prod 生產
將我們原本dev的環境更改為test環境, 在我們本地開發時我們使用的還是測試的介面
const Const = { Runtime: 'prod' // 設定當前執行的環境 } // 全域性變數定義 let appConfig = { wxAppId: 'xxxxx' // 如appId } // 變數內可以填入一些其他的全域性變數 switch (Const.Runtime) { case: 'dev' // 本地開發環境 appConfig = { Url: // 測試地址 } break case: 'test' // 測試環境 appConfig = { Url: // 測試地址 } break case: 'prod' // 生產環境 appConfig = { Url: // 線上地址 } break }
環境已經配置好了
在我們進入微信公眾號頁面時 判斷當前全域性變數的值為dev環境時
// 讓使用者手動輸入token值
prompt('請輸入測試使用者的TOKEN:', '')
(插播)初次步入公眾號的小夥伴可能不理解token 說句大白話就是使用者的唯一標
因為我們在本地環境走的也是測試的介面,
所以在這裡輸入測試的使用者的唯一標識
那麼就可以順利在本地開發和除錯公眾號嘍~
(ps: 微信支付就不要妄想了!)
嗖嗖嗖~ 對應文章