小程序預備課--初探小程序
最近公司在整一個小程序的項目,在此期間學習了下小程序的開發,在這跟大家分享下;
進入今天的主題;本文將分為三個部分為大家講解;第一部分是小程序跳轉小程序,第二部分是小程序跳轉H5,第三部分是H5跳轉小程序;
小程序之間互相跳轉,使用wx.navigateToMiniProgram來實現,官方文檔:https://mp.weixin.qq.com/debug/wxadoc/dev/api/navigateToMiniProgram.html
wx.navigateToMiniProgram({ appId: ‘‘,//小程序id path: ‘pages/index/index?id=123‘,//小程序跳轉路徑 extraData: { foo:‘bar‘ }, envVersion: ‘develop‘, success(res) { // 打開成功 } })
你以為這樣就完事了?當然不是!兩個小程序之間的跳轉是有條件的,打開同一公眾號下關聯的另一個小程序。如果沒有關聯同一個公眾號,則無法成功打開另一小程序。
在這裏lz要插播一句,有關小程序關聯的規則了:
1.所有公眾號都可以關聯小程序。
2.一個公眾號可關聯10個同主體的小程序,3個不同主體的小程序。
3.一個小程序可關聯3個公眾號。
4.公眾號一個月可新增關聯小程序13次,小程序一個月可新增關聯5次。
萬事俱備,就可以愉快的跳轉了;
小程序跳轉H5(用包裹H5更合適),這個之前是沒有方法的,但是微信還是給我們一個驚喜,<web-view>,有沒有感覺很熟悉;這個方法使用是很簡單的,如下
<!-- wxml --> <!-- 指向微信公眾平臺首頁的web-view --> <web-view src="https://mp.weixin.qq.com/"></web-view>
只要填寫答應的src就好了,確定?當然不是,這裏註意點就是在微信小程序開發者後臺會有個業務域名,我們應該配置下頁面所對應的域名,這樣我們的頁面就能包裹在了小程序裏面了;小程序API裏還給了一系列的方法:
lz遇到的需求是h5跳轉到不同域名的落地頁;按照之前的思路配置不同業務域名,但是這根本行不通,因為我們會有特別多的落地頁,而且微信也只是提供了每個月業務域名修改次數限制,所以得另行他法。這裏lz的做法是用iframe去嵌套每個落地頁,還真能行得通·~具體做法是:
包裹的h5在跳轉時利用wx.miniProgram.navigateTo跳轉到一個redirect小程序頁面這裏用<web-view>包裹嵌套iframe的配置業務域名的頁面;這樣就能夠解決問題了。
H5跳轉小程序,看到這你肯定會差異,這怎麽可能,其實是可以通過討巧的辦法進行的,通過我們的好朋友-公眾號去實現,我們可以拿到公眾號推文消息的url,先從H5直接跳轉過去,然後就可以從推文消息進去了;(公眾號的圖文消息,菜單欄都是可以綁定跳轉到小程序的)
初探小程序,後續更新開發部分,菜鳥一枚,一起探討交流;
小程序預備課--初探小程序