我的Next.js應用程式在IE上無法作業。
它顯示了空白螢屏并在控制臺中拋出了語法錯誤。
這很好，因為 IE 即將停用，而且所有這些都很好，但是我想阻止 IE 在檢測到瀏覽器時執行單行代碼。
從這個答案，我可以檢查瀏覽器是否是IE：
if (window.document.documentMode) {
//檢測到IE。
document.write('IE is not supported. 請使用現代瀏覽器！')
}
用戶不再得到空白的螢屏，而是通過上面的資訊看到網站無法作業的原因。
這種方法有兩個問題：
- 將上述代碼放在 Next.js 的什么地方？
- 如何在執行該代碼時終止應用程式，或者是否可以這樣做？
如果有任何幫助，我們將不勝感激。
uj5u.com熱心網友回復：
你不應該依賴Next.js應用程式在過時的/不支持的瀏覽器上顯示資訊，因為代碼本身可能會在這些瀏覽器上崩潰（缺乏polyfills等）
相反，唯一的辦法是在Next.js應用程式上顯示一個資訊。
相反，正確顯示關于過時瀏覽器的警告資訊的唯一方法是異步加載一個 JS 腳本，該腳本不使用 ES5 功能，這樣它就可以在所有瀏覽器上運行（同時，由于它是異步的，所以不會降低你的應用速度或增加捆綁的大小）。
據我所知，_document.js是你最早可以檢查瀏覽器的地方，因為它在第一個頁面請求中被渲染了一次。
你可以使用外部CDN，或者在public檔案夾中創建一個checkBrowser.js檔案。
這里是我的解決方案。
pages/_document.js
export default class MyDocument extends Document {
...
render（） { ...
return (
<Html>
<Head>/span>
<script async src="/scripts/checkBrowser. js" />。
</Head>
...
</Html>
)
}
}
public/scripts/checkBrowser.js
// if browser is IE, redirect.
if (window.document.documentMode) {
window.location.replace('/outdated.html'/span>)
}
public/outdated.html
<html>
<head>
<meta charset="utf-8"/span> />
< meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>不支持的瀏覽器</title>/span>
</head>/span>
<body>
<p>不支持Internet Explorer（IE）。請使用現代瀏覽器。</p>
</body>/span>
</html>
歸功于：來自CDN的腳本，重定向方法，還有@YuZhou分享的那些鏈接
。轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/320210.html
標籤：