前臺(tái)和后臺(tái)亂碼的問(wèn)題可以說(shuō)是家常便飯肠虽，一般兩端定義好使用同一個(gè)字符集是不會(huì)有問(wèn)題刽辙，但是昨天遇見(jiàn)一個(gè)小坑，分享一下披诗。
先說(shuō)環(huán)境吧撬即，后臺(tái)tomcat+spring，標(biāo)準(zhǔn)的SSM框架呈队。tomcat配置文件和我知道能設(shè)置編碼的地方都設(shè)置成UTF-8剥槐。之前使用jQuery請(qǐng)求正常，無(wú)亂碼現(xiàn)象宪摧，因?yàn)樽罱褂胿ue粒竖，jQuery各種意義上的很多功能都使用不上，所以找到了vue-resourse几于，最強(qiáng)大的是這個(gè)還帶有攔截器功能蕊苗，嘛，可以在每次請(qǐng)求前后做一些操作孩革，用處諸君可以隨便想象岁歉。
然后問(wèn)題來(lái)了，一切都那么美好，使用簡(jiǎn)單锅移，功能強(qiáng)大熔掺，可是，可是他居然中文亂碼非剃，這就很奔潰了置逻，網(wǎng)上找了大量的教程，官方文檔也努力找备绽，可是依然沒(méi)找到相關(guān)問(wèn)題券坞。so，只能自食其力咯肺素。
亂碼嘛恨锚，一開(kāi)始想的當(dāng)然是服務(wù)器的編碼，確認(rèn)再三倍靡，應(yīng)該是沒(méi)問(wèn)題的猴伶，之前jQuery請(qǐng)求都是正常的，那好么塌西，觀察jQuery和vue-resourse發(fā)送的請(qǐng)求有何不同他挎，嘛，其實(shí)也就content-type后面多了一個(gè)charset：utf-8捡需。很簡(jiǎn)單办桨，我立馬想到了攔截器，每次請(qǐng)求前給request設(shè)置個(gè)請(qǐng)求頭站辉，大概是這樣寫的呢撞。
Vue.http.interceptors.push((request,next)=>{
? ? request.headers.set('Content-Type','application/x-www-form-urlencoded; charset=UTF-8')
? ? next((response)=>{
? ? ? ? return ?response
? ? })
})
可以，很簡(jiǎn)單庵寞。嗯狸相，看起來(lái)應(yīng)該就可以了，可是試一下發(fā)現(xiàn)捐川，這個(gè)Content-Type怎么完全沒(méi)變啊，然后又是一陣折騰逸尖，比如設(shè)置其他請(qǐng)求頭都有效古沥，可是Content-type卻無(wú)效，嗯娇跟，繼續(xù)看文檔岩齿，發(fā)現(xiàn)Vue.http.options.emulateJSON=true這一句，有個(gè)emulateJSON屬性苞俘，準(zhǔn)確意思沒(méi)弄懂干嘛的盹沈，反正如果設(shè)置成false后臺(tái)連參數(shù)都接不到了，全都是null吃谣。
說(shuō)了這么多發(fā)現(xiàn)好多廢話乞封，嗯做裙，好吧。直接說(shuō)最后解決辦法嘛肃晚，嗯锚贱，vue-resourse嘛，畢竟比較簡(jiǎn)單关串，問(wèn)題也很明顯了拧廊，就是設(shè)置了emulateJSON屬性他會(huì)自動(dòng)設(shè)置Content-Type請(qǐng)求頭，而且比他給的api調(diào)用更靠后晋修，so吧碾，靈機(jī)一動(dòng)去他的js文件里看看咯。
找到引用js的位置墓卦，我的是這樣的
找到這些js文件滤港，打開(kāi)搜索application/x-www-form-urlencoded，然后手動(dòng)再后面加上;charset:utf-8
嗯趴拧。暫時(shí)OK溅漾。不知道將來(lái)打包出來(lái)會(huì)不會(huì)有其他問(wèn)題。
