BUG解決: 使用IE11瀏覽器向伺服器 請求帶有中文的資訊時，出現404介面，但Chrome瀏覽器可以正常訪問;
阿新 • • 發佈：2021-06-13
問題概述:
使用IE11瀏覽器向伺服器 請求帶有中文的資訊時，出現404介面，但Chrome瀏覽器可以正常訪問;
需求:
頁面中 有兩個超連結，點選超連結,可以彈出下載框;
出Bug的程式碼:
<head> <meta charset="UTF-8"> <title>下載頁面</title> </head> <body> <a id="/day15/downloadServlet?filename=九尾.jpg" >圖片1</a> ---> 備註: /day15為虛擬目錄，downloadServlet為 Servlet的實現類;<a href="/day15/downloadServlet?filename=2.jpg"> 圖片2</a> </body>
出現問題:
當彈出框顯示的檔名稱為中文名稱時，使用IE11進行資料請求時，出現404介面，但Chrome瀏覽器 是可以正常使用的;
使用F12查詢了瀏覽器實際向伺服器請求時的資訊，IE11的請求內容為: filename=亂碼; chrome瀏覽器請求的內容為: filename=正常的URL編碼;
問題解決方法:
1. 使用JavaScript中的Global物件的encodeURI() 或者encodeURIComponent()方法對 中文字元進行url編碼 得到一個新得物件;
2. 使用這個新的到的物件，使用"+"運算子 新增到檔案的url Pattern後;
修改後的頁面程式碼:
<html lang="en"> <head> <meta charset="UTF-8"> <title>下載頁面</title> <script> var pic_JiuWei = encodeURIComponent("九尾.jpg"); window.onload = function () { var a = document.getElementById("pic1"); a.setAttribute("href","/day15/downloadServlet?filename="+ pic_JiuWei); } </script> </head> <body> <a id="pic1" > 圖片1</a> <a href="/day15/downloadServlet?filename=2.jpg"> 圖片2</a> </body> </html>