微信小程序、微信公眾號、H5之間相互跳轉
答案是:可以相互關聯。
在微信公眾號里可以添加小程序。
可關聯已有的小程序或快速創建小程序。已關聯的小程序可被使用在自定義菜單和模版消息等場景中。
公眾號可關聯同主體的10個小程序及不同主體的3個小程序。同一個小程序可關聯最多50個公眾號。
1、公眾號跳小程序
比如說 “豐巢快遞櫃” 公眾號關聯的小程序:豐巢寄快遞。
2、小程序跳公眾號
打開“豐巢寄快遞”,點擊右上角的菜單選項,然后點擊”關於豐巢寄快遞“,就可以看見關聯的公眾號了。
二、小程序和H5
答案是:可以相互跳轉。
1、小程序跳H5
之前一直是有限制,就在11月2號晚上終於公布,小程序可以跳H5的好消息了(前提小程序管理后台配置域名白名單),忍不住哈哈哈哈哈哈哈哈。
小程序也更新了相應的文檔:
web-view 組件是一個可以用來承載網頁的容器,會自動鋪滿整個小程序頁面。但個人類型與海外類型的小程序暫不支持使用。
注:基礎庫 1.6.4 開始支持,低版本需做兼容處理。
2、H5跳小程序
小程序的URL Scheme的結構為 weixin://dl/business/?t= *TICKET*
,其中TICKET
由服務端接口返回的。服務端接口區分兩種形式:HTTPS調用
和雲開發調用
。
HTTPS調用
1-獲取ACCESS_TOKEN , 對應的APPID和APPSECRET換成自己對應的小程序即可。
請求地址:
GET https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
返回的數據結構如下:
{
"access_token": "ACCESS_TOKEN",
"expires_in": 7200
}
2.獲取URL Scheme
請求地址:POST https://api.weixin.qq.com/wxa/generatescheme?access_token=ACCESS_TOKEN
請求參數:
屬性 | 類型 | 默認值 | 必填 | 說明 |
---|---|---|---|---|
access_token | string | 是 | 接口調用憑證 | |
jump_wxa | Object | 否 | 跳轉到的目標小程序信息。 | |
is_expire | boolean | false | 否 | 生成的scheme碼類型,到期失效:true,永久有效:false。 |
expire_time | number | 否 | 到期失效的scheme碼的失效時間,為Unix時間戳。生成的到期失效scheme碼在該時間前有效。最長有效期為1年。生成到期失效的scheme時必填。 |
jump_wxa 的結構
屬性 | 類型 | 默認值 | 必填 | 說明 |
---|---|---|---|---|
path | string | 是 | 通過scheme碼進入的小程序頁面路徑,必須是已經發布的小程序存在的頁面,不可攜帶query。path為空時會跳轉小程序主頁。 | |
query | string | 是 | 通過scheme碼進入小程序時的query,最大128個字符,只支持數字,大小寫英文以及部分特殊字符:!#$&'()*+,/:;=?@-._~ |
請求示例:
{
"jump_wxa": {
"path": "/pages/index/index",
query": ""
},
"is_expire": true,
"expire_time": 1606737600
}
返回結果
{
"errcode": 0,
"errmsg": "ok",
"openlink": Scheme,
}
參考
喜大普奔,微信終於支持外網打開小程序啦!==》https://blog.csdn.net/qq_34998786/article/details/113623278
模式二 https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html#21
https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/staticstorage/jump-miniprogram.html
只要引入路徑為https://res.wx.qq.com/open/js/jweixin-1.3.0.js的js文件,然后在執行以下代碼就可以了。
wx.miniProgram.navigateTo({url: '/path/to/page'})
H5跳轉微信小程序的三種方式==>www.mpgcw.com/8299.html
聊聊從H5頁面跳轉到小程序的幾種實現方案(附常見坑點)==>https://www.uoften.com/article/220251.html
談談從H5頁面跳轉到小程序的幾種實現方案附常見坑點 (h5跳微信小程序) 轉==>https://www.cnblogs.com/whatlonelytear/p/17532599.html
在微信里h5只能跳正式版小程序, 不能跳體驗版和開發版小程序 https://zhujicankao.com/74527.html
但在瀏覽器里面是可以跳體驗版小程序的
三、公眾號和H5
答案是:可以相互跳轉。
1、公眾號跳H5
這個好像一直都是支持的,公眾號的自定義菜單呀、自定義消息呀,這些都可以放H5鏈接跳轉,這就沒啥好討論了,下面說下H5怎么跳轉公眾號吧。
2、H5跳公眾號
本身來說這是不可以的,但也有間接的做法,那就是跳轉到公眾號的歷史消息頁面,然后再進入微信公眾號,這是目前大概最好的做法了。
還是以”豐巢快遞櫃“這個公眾號為例,打開公眾號,點擊”查看歷史消息“,進入歷史消息頁面。可以把這個頁面的地址復制出來,然后放到H5頁面里就ok啦。
四、小程序和小程序
答案是:可以相互跳轉。
打開微信小程序開發文檔,有一個新增的API可以實現。
但得注意2點:
1、低版本需要做兼容處理。
2、相互跳轉的小程序必須是同一公眾號下關聯的。
至此,微信小程序、微信公眾號和H5之間能否相互跳轉就說完了,有什么不對的地方請指出哈,不勝感激~~
作者: 嬌嬌jojo
鏈接:https://www.imooc.com/article/22900
來源:慕課網
本文原創發布於慕課網 ,轉載請注明出處,謝謝合作
小程序跳小程序
wx.navigateToMiniProgram({
appId: 'youappid', // 微信實名小程序 APPID(固定值)
path: 'pages/index/index?cshopUrl=h5PageName', // 需要打開微信實名小程序的目標 URL(固定值)
extraData: {
},
envVersion: 'release', // 要打開微信小程序的版本 develop(開發版),trial(體驗版),release(正式版)
success(res) {
// 打開成功
console.log('navigateToMiniProgram 跳轉成功!')
}
})
小程序跳小程序
- 小程序與小程序之間互相可以跳轉,形成流量的循環.在小程序中怎么實現的呢
- 小程序中提供了兩種方式實現小程序與小程序之間的跳轉
如何實現小程序與小程序之間的跳轉==>https://www.cnblogs.com/tsalita/p/16188073.html
使用標簽方式跳轉
<view>
<navigator
target="miniProgram"
open-type="navigate"
app-id="wx66d9cf3762c49a1a"
path="pages/index/index"
version="release"
>打開綁定的小程序</navigator>
</view>
整體代碼
<template>
<view>
<view class="container"><view @tap="onJumpMin">打開跳轉到其他小程序方式1</view></view>
<view>
<navigator
target="miniProgram"
open-type="navigate"
app-id="wx2ac2313767a99df9"
path="pages/index/index" <!-- 可去掉 -->
version="release"
>
打開綁定的小程序方式2
</navigator>
</view>
</view>
</template>
<script>
export default {
data() {
return {
};
},
methods: {
onJumpMin() {
wx.navigateToMiniProgram({
appId: 'wx9fbad659d526c9bc', // 需要跳轉到指定的小程序appid
path: 'pages/home/home', // 打開的頁面 - 可不要
extraData:{ //額外參數
},
envVersion: 'release',//要打開微信小程序的版本 develop(開發版), trial(體驗版) ,release(正式版)
success(res) {
// 打開成功
console.log("navigateToMiniProgram 跳轉成功");
console.log(res);
}
})
}
}
};
</script>
更多傳參方式
<template>
<view>
<view class="container"><view @tap="onJumpMin(item.id)">打開跳轉到其他小程序方式1</view>
</view>
</template>
<script>
export default {
data() {
return {
list2:[
{src:'...',title:'...',id:'wx9fbad659d526c9bc'},
]
};
},
methods: {
onJumpMin(id) {
uni.navigateToMiniProgram({
appId: id, // 需要跳轉到指定的小程序appid
envVersion: 'release'
});
}
}
};
</script>
使用標簽的方式跳轉,非常簡單,只需要在wxml中使用target,open-type,app-id,path,指定相應的參數就可以實現跳轉了的
查看小程序id
一、移動端查看微信小程序APPID方法
小程序id怎么查看?有兩種方式,一種是在手機上,一種是在電腦上,下面是具體的查看方法。
1.首先在微信上打開任意微信小程序的任意頁面,點擊小程序右上角的【...】分享按鈕,再點擊小程序名稱進入即可。
2.其次進入小程序詳情頁,點擊更多資料,進入即可
3.最后進入小程序后台,第三欄就是微信小程序APPID賬號,如圖所示:
app跳小程序
官方最新說法
https://developers.weixin.qq.com/community/develop/article/doc/0002aec12ccf18c57e4a798e25b013
對於已通過認證的開放平台賬號,其移動應用可以跳轉至任何合法的小程序,且不限制跳轉的小程序數量。
對於未通過認證的開放平台賬號,其移動應用僅可以跳轉至同一開放平台賬號下小程序。
注意:若移動應用未上架,則最多只能跳轉小程序100次/天,用於滿足調試需求。
Android示例
Ios示例
官方鏈接
功能介紹 | 微信開放文檔
https://developers.weixin.qq.com/doc/oplatform/Mobile_App/Launching_a_Mini_Program/Launching_a_Mini_Program.html
android源碼跳轉app樣例
private void launchMiniProgram(String path) {
String appId = "應用appid";
// 填寫移動應用的appId, 這個 應用appid 是微信開放平台的, 不是小程序的appid
// 2020-04-30 官方回復 :對於已通過認證的開放平台賬號,其移動應用可以跳轉至任何合法的小程序,且不限制跳轉的小程序數量。
IWXAPI api = WXAPIFactory.createWXAPI(context, appId);
WXLaunchMiniProgram.Req req = new WXLaunchMiniProgram.Req();
req.userName = "原始id"; // 填小程序原始id , 注意不是小程序的 appid
req.path = path; //拉起小程序頁面的路徑,可帶參數,不填默認拉起小程序首頁
req.miniprogramType = WXLaunchMiniProgram.Req.MINIPROGRAM_TYPE_PREVIEW;// MINIPROGRAM_TYPE_TEST 開發版 ,MINIPROGRAM_TYPE_PREVIEW 體驗版, MINIPTOGRAM_TYPE_RELEASE 正式版
api.sendReq(req);
}
蘋果.........
- req.userName 參數是小程序
原始id
,不是小程序的appid,不然會提示跳轉失敗。 - req.path 參數是小程序里面的頁面路徑,及json文件里面的路徑,比如:/pages/index/index?id=1
- req.miniprogramType 小程序的版本 , MINIPROGRAM_TYPE_TEST 開發版 MINIPROGRAM_TYPE_PREVIEW 體驗版, MINIPTOGRAM_TYPE_RELEASE 正式版
回調WXEntryActivity
@Override
public void onResp(BaseResp baseResp) {
// baseresp.getType 1:第三方授權, 2:分享
LogUtil.i("baseresp.getType = " + baseResp.getType());
switch (baseResp.getType()) {
case 1:
break;
case 2:
break;
case ConstantsAPI.COMMAND_LAUNCH_WX_MINIPROGRAM:
WXLaunchMiniProgram.Resp launchMiniProResp = (WXLaunchMiniProgram.Resp) baseResp;
//獲取參數
String extraData = launchMiniProResp.extMsg; //對應小程序組件 <button open-type="launchApp"> 中的 app-parameter 屬性
break;
}
}
舊版說法(仍有參考價值) 但意義不大,主要看
APP跳轉小程序,小程序跳轉APP==>https://www.cnblogs.com/ts119/p/14468591.html
ios app跳轉微信小程序==>https://www.cnblogs.com/gaozhang12345/p/9228310.html
APP跳轉小程序,小程序跳轉APP==>https://www.cnblogs.com/ts119/p/14468591.html
↓Android APP拉起小程序、分享小程序、小程序打開APP==>https://cloud.tencent.com/developer/article/2019830
app內嵌的H5喚起微信小程序
蘋果app跳小程序使用 urllink 的 location.href="https://wxaurl.cn/Ss9TuKRttbt" , 可以直接喚起微信小程序
蘋果app跳小程序使用 a標簽 <a href="weixin://dl/business/?t=aMDDWVeO75d" > jump </a> , 可以直接喚起微信小程序, 但會先喚起自帶默認瀏覽器, 再通過瀏覽器喚起對應小程序 (本條為猜測, 未親測)
蘋果app跳小程序使用 urlschema 的 location.href="weixin://dl/business/?t=aMDDWVeO75d" 不可以喚起微信小程序
蘋果app跳小程序使用 a標簽 <a href="weixin://dl/business/?t=aMDDWVeO75d" > jump </a> 可以直接喚起微信小程序, 但會先喚起自帶默認瀏覽器, 再通過瀏覽器喚起對應小程序
安卓app跳小程序使用 urllink 的 location.href="https://wxaurl.cn/Ss9TuKRttbt" , 不可以喚起微信小程序
安卓app跳小程序使用 a標簽 <a href="weixin://dl/business/?t=aMDDWVeO75d" > jump </a> , 可以直接喚起微信小程序, 但會先喚起自帶默認瀏覽器, 再通過瀏覽器喚起對應小程序 (本條為猜測, 未親測)
安卓app跳小程序使用 urlschema 的 location.href="weixin://dl/business/?t=aMDDWVeO75d" 不可以喚起微信小程序
安卓app跳小程序使用 a標簽 <a href="weixin://dl/business/?t=aMDDWVeO75d" > jump </a> 可以直接喚起微信小程序, 但會先喚起自帶默認瀏覽器, 再通過瀏覽器喚起對應小程序
app分享小程序
private void shareMiniProgram(String url) {
WXMiniProgramObject miniProgramObj = new WXMiniProgramObject();
miniProgramObj.webpageUrl = url; // 兼容低版本的網頁鏈接
miniProgramObj.miniprogramType = WXMiniProgramObject.MINIPROGRAM_TYPE_PREVIEW;// 正式版:0,測試版:1,體驗版:2
miniProgramObj.userName = "原始id"; // 小程序原始id
miniProgramObj.path = "/pages/home/home"; //小程序頁面路徑
WXMediaMessage msg = new WXMediaMessage(miniProgramObj);
msg.title ="分享的標題"; // 小程序消息title
msg.description = "分享的描述"; // 小程序消息desc
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.pindan);
msg.thumbData = bmpToByteArray(bitmap, true); // 小程序消息封面圖片,小於128k
SendMessageToWX.Req req = new SendMessageToWX.Req();
req.transaction = buildTransaction("webpage");
req.message = msg;
req.scene = SendMessageToWX.Req.WXSceneSession; // 目前支持會話
api.sendReq(req);
}
小程序打開APP(基本不支持)
因為微信小程序本身是不推薦引流到外部的,所以正規的方法其實都是被禁止掉的。
1.wx.openUrl可直接打開內置瀏覽器頁面 (2021年時可以使用,現在已被禁用)
2.通過原生按鈕跳轉到小程序客服,客服發送鏈接卡片,通過卡片的鏈接進入。
3.跳轉到公眾號文章 ,文章底部的查看全文可以跳轉到任意鏈接。
<button open-type="launchApp" app-parameter="wechat" binderror="launchAppError">打開APP</button>
- open-type=“launchApp” 開放能力
- app-parameter=“wechat” 傳參
- binderror=“launchAppError” 失敗回調
Page({
launchAppError (e) {
console.log(e.detail.errMsg)
}
})
另附:微信分享打開App:使用魔窗SDK實現,實際是網頁打開App,蘋果倒是可以直接打開App,安卓只能用網頁打開分享再打開App。具體實現可以查看官網文檔。我是在unity游戲項目上實現的,安卓需要添加一個透明Activity作為初始界面,不然沒有分配link的界面會實現不了吧,IOS是同事配置的。
參考
微信小程序、微信公眾號、H5之間相互跳轉==>https://www.cnblogs.com/colorful-paopao1/p/8608609.html
APP和小程序互相跳轉==>https://blog.csdn.net/m0_71272694/article/details/127600021