我已经试了几个小时为我的客户的应用程序在Facebook应用程序中创建一个深度链接,我不知道我做错了什么,但它仍然不起作用。这是我的HTML,如果需要更多信息来帮助回答(比如应用程序名称等(,我非常乐意私下给你。
这个index.html的URL是ELEMENT_URL
,我在https://developers.facebook.com/tools/debug/这表明一切都很好。
在Facebook应用程序之外,一切都如预期:重定向、应用程序打开、自定义方案或通用链接。一切都很好。除了Facebook。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{ELEMENT_TITLE}</title>
<meta name="description" content="Find this in my app">
<meta property="og:title" content="{ELEMENT_TITLE}" />
<meta property="og:url" content="{ELEMENT_URL}" />
<meta property="og:description" content="Find this in my app">
<meta property="og:image" content="{ELEMENT_PICTURE}" >
<meta property="og:type" content="article" />
<meta property="og:locale" content="fr_FR" />
<meta property="fb:app_id" content="{FACEBOOK_APP_ID}" />
<meta property="al:ios:url" content="myapp://element/{ELEMENT_ID}" />
<meta property="al:ios:app_store_id" content="{APP_STORE_ID}" />
<meta property="al:ios:app_name" content="MyApp" />
<meta property="al:android:url" content="myapp://element/{ELEMENT_ID}" />
<meta property="al:android:app_name" content="MyApp" />
<meta property="al:android:package" content="com.myapp" />
<meta property="al:web:url" content="{ELEMENT_OUTSIDE_URL}" />
<meta property="al:web:should_fallback" content="false" />
<script>
function redirect() {
var userAgent = navigator.userAgent || navigator.vendor || window.opera;
var ios = /iPad|iPhone|iPod/.test(userAgent) && !window.MSStream;
var language = /fr|FR/.test(navigator.language) ? 'fr' : 'en'
if (ios) {
window.location.replace('https://itunes.apple.com/se/app/my-app/{APP_STORE_ID}')
return
}
var android = /android/i.test(userAgent);
if (android) {
window.location.replace('https://play.google.com/store/apps/details?id=com.myapp&hl=' + language)
return
}
window.location.replace('{ELEMENT_OUTSIDE_URL}')
}
redirect()
</script>
</head>
<body>
</body>
</html>
好吧,对于像我这样花了几个小时进行深度链接的人,我找到了Facebook和Messenger的修复程序,这要归功于https://stephenradford.me/link-to-url-scheme-or-not-and-force-out-of-the-app-youre-in/
这个想法是在JS脚本window.location = myapp://element/{ELEMENT_ID}
中添加自定义方案url,如果什么都没发生,则在几毫秒后重定向。
所以整个脚本是:
I've tried for hours to make a deep link for my client's app working in Facebook app, and I don't know what I did wrong but it is still not working. Here is my HTML, and if some more information is needed to help answer (like the app name and so on), I'll be more than pleased to give you in private.
The URL for this index.html is ELEMENT_URL, and I tried this url in https://developers.facebook.com/tools/debug/ which showed everything alright.
Outside Facebook app, everything works as expected : the redirection, the app opening, with the custom scheme or with the universal link. Everything good. Except Facebook.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{ELEMENT_TITLE}</title>
<meta name="description" content="Find this in my app">
<meta property="og:title" content="{ELEMENT_TITLE}" />
<meta property="og:url" content="{ELEMENT_URL}" />
<meta property="og:description" content="Find this in my app">
<meta property="og:image" content="{ELEMENT_PICTURE}" >
<meta property="og:type" content="article" />
<meta property="og:locale" content="fr_FR" />
<meta property="fb:app_id" content="{FACEBOOK_APP_ID}" />
<meta property="al:ios:url" content="myapp://element/{ELEMENT_ID}" />
<meta property="al:ios:app_store_id" content="{APP_STORE_ID}" />
<meta property="al:ios:app_name" content="MyApp" />
<meta property="al:android:url" content="myapp://element/{ELEMENT_ID}" />
<meta property="al:android:app_name" content="MyApp" />
<meta property="al:android:package" content="com.myapp" />
<meta property="al:web:url" content="{ELEMENT_OUTSIDE_URL}" />
<meta property="al:web:should_fallback" content="false" />
<script>
function redirect() {
var userAgent = navigator.userAgent || navigator.vendor || window.opera;
var ios = /iPad|iPhone|iPod/.test(userAgent) && !window.MSStream;
var language = /fr|FR/.test(navigator.language) ? 'fr' : 'en'
if (ios) {
window.location = myapp://element/{ELEMENT_ID};
window.setTimeout(() => {
window.location.replace('https://itunes.apple.com/se/app/my-app/{APP_STORE_ID}');
}, 25)
return
}
var android = /android/i.test(userAgent);
if (android) {
window.location = myapp://element/{ELEMENT_ID};
window.setTimeout(() => {
window.location.replace('https://play.google.com/store/apps/details?id=com.myapp&hl=' + language);
}, 25)
return
}
window.location.replace('{ELEMENT_OUTSIDE_URL}')
}
redirect()
</script>
</head>
<body>
</body>
</html>