IOS Webアプリでwindow.open()
を呼び出すと、モバイルサファリではなくWebアプリでページが開きます。
モバイルサファリでWebページを強制的に開くにはどうすればよいですか?
注:ストレート<a href>
リンクはオプションではありません。
これは可能です。 iOS5スタンドアロンWebアプリでテスト済み:
HTML:
<div id="foz" data-href="http://www.google.fi">Google</div>
JavaScript:
document.getElementById("foz").addEventListener("click", function(evt) {
var a = document.createElement('a');
a.setAttribute("href", this.getAttribute("data-href"));
a.setAttribute("target", "_blank");
var dispatch = document.createEvent("HTMLEvents");
dispatch.initEvent("click", true, true);
a.dispatchEvent(dispatch);
}, false);
ここでテストできます: http://www.hakoniemi.net/labs/linkkitesti.html
JavaScript window.open()
を使用してiOS WebアプリをエスケープするのはNOT POSSIBLEです。リンクをモバイルサファリで開く場合は、<a href>
リンク。
Vueの実装。お役に立てば幸いです。
<template>
<div @click='handler()'>{{ text }}</div>
</template>
<script>
export default {
props: {
href: String,
text: String,
},
methods: {
handler() {
const a = document.createElement('a')
a.setAttribute('href', this.href)
a.dispatchEvent(new MouseEvent("click", {'view': window, 'bubbles': true, 'cancelable': true}))
}
}
}
</script>
別のサブドメインを使用するか、httpsの代わりにhttpを使用する場合、window.open()を使用して、iOSに強制的にサファリのPWAからリンクを開くことができます。
例えば、take example.com
window.open('http://example.com','_blank')
注:ブラウザで開くと、サーバーはhttpをhttpsにリダイレクトします。したがって、セキュリティ上の懸念はありません。
(または)
window.open('api.example.com','_blank')