????????目前公司想把剛開發(fā)的h5以及小程序打通，就是通過h5可以跳轉(zhuǎn)到小程序進(jìn)行使用。那么問題來了，產(chǎn)品希望直接通過一個事件就直接跳轉(zhuǎn)到小程序，微信的開發(fā)環(huán)境支持這樣的操作嗎？其實(shí)在開發(fā)文檔上面已近說的比較清楚了，我在這整理出了具體的實(shí)現(xiàn)；

一、跳轉(zhuǎn)到小程序的幾種方式

? ? ? ? 1、公眾號跳轉(zhuǎn)到小程序，這個的話在公眾號管理頁面配置一下就好了；

????????2、通過普通的二維碼跳轉(zhuǎn)到小程序里面

雖然小程序的功能越來越強(qiáng)大，但是再開發(fā)的時候還是受到很多的限制，對于產(chǎn)品提出的“ 通過點(diǎn)擊一個按鈕就跳到小程序 ”這個需求真的就是無能為力了，不過隨著微信的更能更迭越來越頻繁，相信以后說不定就實(shí)現(xiàn)了呢；最近開發(fā)支付寶小程序時候發(fā)現(xiàn)，微信小程序和支付寶小程序開發(fā)大部分是一樣的，微信在開發(fā)上回更加成熟些，代碼審核也快，我們今天實(shí)現(xiàn)的跳轉(zhuǎn)小程序同樣也適用于支付寶小程序開發(fā)；

二、邏輯整理

? ? ? ?實(shí)通過用戶觸發(fā)按鈕生成一個二維碼，用戶通過使用微信掃一掃或者長按識別二維碼進(jìn)入小程序（必須要觸發(fā)微信自帶的掃一掃才可以），通過二維碼攜帶的參數(shù)，小程序進(jìn)行識別相關(guān)數(shù)據(jù)，比如登錄狀態(tài)；

三、配置

? ? ? ? h5端：通過qrcodejs插件動態(tài)把url地址生成二維碼，攜帶相關(guān)的用戶信息；（用url地址生成二位碼是因?yàn)槲⑿盘D(zhuǎn)到url相關(guān)頁面的時候會判斷是否需要跳轉(zhuǎn)小程序，這個下面小程序配置校驗(yàn)文件有講到）

? ? ? ? ? ? ? ? （因?yàn)閔5也是通過微信掃一掃進(jìn)入的h5項(xiàng)目，在微信瀏覽器上可以直接長按進(jìn)行二維碼識別）

? ? 小程序：進(jìn)入小程序開發(fā)平臺? -> 開發(fā) -> 開發(fā)設(shè)置 ->掃普通鏈接二維碼打開小程序

二維碼規(guī)則： 微信api里說的很清楚了

? ? ? ? 1、二維碼規(guī)則的域名須通過ICP備案的驗(yàn)證。

? ? ? ? 2、支持http、https、ftp開頭的鏈接（如：http://wx.qq.com、https://wx.qq.com/mp/、https://wx.qq.com/mp?id=123）。

? ? ? ? 3、一個小程序帳號可配置不多于10個二維碼前綴規(guī)則。

前綴占用規(guī)則：

????????開發(fā)者可選擇是否占用符合二維碼匹配規(guī)則的所有子規(guī)則。如選擇占用，則其他帳號不可申請使用滿足該前綴匹配規(guī)則的其他子規(guī)則。

如：若開發(fā)者A配置二維碼規(guī)則：https://wx.qq.com/mp?id=123，并選擇“占用所有子規(guī)則“，其他開發(fā)者將不可以配置滿足前綴匹配的子規(guī)則如https://wx.qq.com/mp?id=1234。

校驗(yàn)文件：

?? ? ? ? 通過把下載的校驗(yàn)文件存放到二維碼對應(yīng)url所在的服務(wù)器更目錄下就可以了。 剛開始的時候會疑惑，微信掃碼怎么知道是怎么識別是跳轉(zhuǎn)小程序呢， 這個關(guān)鍵就在于校驗(yàn)文件上面了，h5通過把url生成二維碼，微信在使用掃碼的啥時候請求服務(wù)器的時候先會去查找有沒有對應(yīng)的校驗(yàn)文件，有的話就會跳轉(zhuǎn)到小程序；如果存放地址失敗則不能保存；

測試范圍：

? ? ? ? 這個通過自己的需求來進(jìn)行配置就可以了，

? ? 保存成功后就可以進(jìn)行跳轉(zhuǎn)了，但是注意一點(diǎn)：
? ? ? ? ?必須是通過二維碼+微信掃一掃/長按識別二維碼才可以

相關(guān)連接：

? ? 微信小程序掃碼打開小程序接入指南

第一次寫文章，有什么不好的歡迎大家指出，想著入行兩年多了，有些概念要學(xué)會去整理和歸納才不至于忘記；