解決JS外部文件中文注釋出現(xiàn)亂碼問題
問題描述
中文亂碼在Java Web開發(fā)中經(jīng)常出現(xiàn),這是由于不同的部分編碼不一樣造成的,一般在開發(fā)中,我們把所有能設編碼的地方,全部設置成UTF-8,但是有時候還是會出現(xiàn)亂碼的情況。在開發(fā)中,一般把js代碼從html中抽出來,放到一個js文件中,js文件中包含中文,在瀏覽器中頁面沒有出現(xiàn)亂碼,一切正常,當我們打開源碼點進js文件,我們發(fā)現(xiàn)js文件中的中文注釋和js代碼中的中文全是亂碼。
問題原因
我們沒有告訴瀏覽器,當前的文件使用何種編碼,瀏覽器默認使用的的GBK編碼,但是我們js文件使用的UTF-8的編碼,當然會出現(xiàn)亂碼了,有的同學會問了,為什么頁面沒有出現(xiàn),那是因為我們在頁面里面加上以下代碼:
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
或者:
<meta charset="utf-8">
這就告訴了瀏覽器,你用UTF-8來渲染這個頁面,我們這個頁面是用UTF-8來編碼的,這個時候就是正常顯示的。或者是在Java代碼中使用下面的代碼:
response.setContentType("text/html;charset=UTF-8");
這也是相當于告訴瀏覽器,當前使用的UTF-8編碼。
解決方案
聰明的同學已經(jīng)想到了,我們要告訴瀏覽器,當前文件的編碼格式,在頁面中,我們可以使用上面的三種方式來告訴瀏覽器當前頁面的編碼,但是在js文件中,使用不了。咋辦?其實很簡單,我們可以在web.xml中,使用一個過濾器,來對所有的的響應設置編碼格式為UTF-8:
<filter> <filter-name>encodingFilter</filter-name> <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class> <init-param> <param-name>encoding</param-name> <param-value>UTF-8</param-value> </init-param> <init-param> <param-name>forceEncoding</param-name> <param-value>true</param-value> </init-param> </filter> <filter-mapping> <filter-name>encodingFilter</filter-name> <url-pattern>/*</url-pattern> </filter-mapping>
上面的過濾器,對所有的請求響應設置的編碼為UTF-8。
清除一下瀏覽器緩存,刷新一下,我們發(fā)現(xiàn)已經(jīng)能夠正確的顯示中文了。
說明一下,前提是所有的文件編碼是UTF-8。
以上所述是小編給大家介紹的解決JS外部文件中文注釋出現(xiàn)亂碼問題,希望對大家有所幫助,如果大家有任何疑問歡迎給我留言,小編會及時回復大家的!
相關(guān)文章
純js三維數(shù)組實現(xiàn)三級聯(lián)動效果
這篇文章主要為大家詳細介紹了純js三維數(shù)組實現(xiàn)三級聯(lián)動效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-02-02javascript 文件的同步加載與異步加載實現(xiàn)原理
本文將介紹javascript 文件的同步加載與異步加載實現(xiàn)原理,需要了解的朋友可以了解下2012-12-12JS正則匹配URL網(wǎng)址的方法(可匹配www,http開頭的一切網(wǎng)址)
這篇文章主要介紹了JS正則匹配URL網(wǎng)址的方法,可實現(xiàn)匹配www,http開頭的一切網(wǎng)址的功能,涉及JS正則匹配字符串、數(shù)字及特殊字符構(gòu)建URL的操作技巧,需要的朋友可以參考下2017-01-01JavaScript Array實例方法flat的實現(xiàn)
flat() 方法用于將一個嵌套多層的數(shù)組進行扁平,返回新數(shù)組,它不會改變原始數(shù)組, flat 方法在處理多維數(shù)組時非常有用,它可以讓數(shù)組操作變得更加靈活和簡潔,本文給大家介紹了JavaScript Array實例方法flat的實現(xiàn),需要的朋友可以參考下2024-03-03