如何打开默认浏览器从instagram在应用程序浏览器页面链接

Question

我的网站中的一些页面具有PWA安装功能(应用程序浏览器中的instagram不支持这些功能(。因此，当我的访问者点击这些页面链接时，我想在本地浏览器中打开它，而不是在应用程序浏览器中的Instagram中保持导航。

我尝试了以下方法：

$('.my-link').on('click', function(evt){
if(navigator.userAgent.includes("Instagram")){
evt.preventDefault();
window.open($(this).attr('href'), '_blank');
return false;
}
return true;
});  

if条件匹配true，但目标页面仍在应用浏览器中的Instagram中打开。我尝试过window.open($(this(.attr('ref'(，'_system'(也没有成功。

有线索吗？

更新1

尝试使用URI方案来强制打开浏览器，但不幸的是，这似乎不是一个好的解决方案。Safari没有URI方案。谷歌浏览器有，但我们不能保证用户在安卓系统中有Chrome浏览器，我们也不能检测用户有什么浏览器。

$('a.new-window-if-instagram').on('click', function(evt){
if(navigator.userAgent.includes("Instagram")){

if (/android/i.test(navigator.userAgent)) {
evt.preventDefault();
var url = $(this).attr('href').replace("https://", "googlechromes://");
url = url.replace("http://", "googlechrome://");
window.open(url, '_blank');
return false;
}
if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
// Safari doest have URI scheme...
}
}
return true;
}); 

Answer 1

我目前也有同样的问题，但至少我找到了一个适用于Android的解决方案。我不知道你是否使用PHP作为后端语言，但如果其他人发现了这一点，这可能会很有用：

<?php
$ua = strtolower($_SERVER['HTTP_USER_AGENT']);
if ((strpos($ua, 'mobile/') !== false) && (strpos($ua, 'safari/') == false)) // Validation code for iOS mobile
{
// Show a message that ask user to open with default browser
}
else if (isset($_SERVER['HTTP_X_REQUESTED_WITH'])) // Validation code for Android mobile
{
header('Content-type: application/pdf');
header('Content-Transfer-Encoding: binary');
header('Accept-Ranges: bytes');
}

这是对iOS应用内浏览器和Android应用内浏览器的验证。

对于Android：我们将页面的内容类型更改为PDF。由于应用内浏览器无法处理PDF文件，它将在真实的浏览器(用户设置中定义的默认浏览器(中打开页面。当页面再次加载时，验证将失败，因为它不再是应用内浏览器。

对于iOS：由于我们可以在iOS中验证应用内浏览器，但不能自动重定向用户，我目前正在做的是显示一条消息，要求用户使用其默认浏览器打开此页面(您可以在User-Agent上使用开关盒更改消息，因为这不是每个应用内浏览器的相同步骤(

如果我找到一个适用于iOS的解决方案，我会更新我的答案。