https://segmentfault.com/u/chyingp
在web服務端開發(fā)中,字符的編解碼幾乎每天都要打交道。編解碼一旦處理不當,就會出現(xiàn)令人頭疼的亂碼問題。
不少從事node服務端開發(fā)者,由于對字符編碼碼相關(guān)知識了解不足,遇到問題時,經(jīng)常會一籌莫展,花大量的時間在排查、解決問題。
文本先對字符編解碼的基礎(chǔ)知識進行簡單介紹,然后舉例說明如何在node中進行編解碼,最后是服務端的代碼案例。本文相關(guān)代碼示例可在這里找到。
在網(wǎng)絡(luò)通信的過程中,傳輸?shù)亩际嵌M制的比特位,不管發(fā)送的內(nèi)容是文本還是圖片,采用的語言是中文還是英文。
舉個例子,客戶端向服務端發(fā)送'你好'。
客戶端 --- 你好 ---> 服務端
這中間包含了兩個關(guān)鍵步驟,分別對應的是編碼、解碼。
客戶端:將'你好'這個字符串,編碼成計算機網(wǎng)絡(luò)需要的二進制比特位。
服務端:將接收到的二進制比特位,解碼成'你好'這個字符串。
總結(jié)一下
編碼:將需要傳送的數(shù)據(jù),轉(zhuǎn)成對應的二進制比特位。
解碼:將二進制比特位,轉(zhuǎn)成原始的數(shù)據(jù)。
上面有些重要的技術(shù)細節(jié)沒有提到,答案在下一小節(jié)。
客戶端怎么知道'你好'這個字符對應的比特位是多少?
服務端收到二進制比特位之后,怎么知道對應的字符串是什么?
上面提到字符、二進制的轉(zhuǎn)換問題。既然兩者可以互相轉(zhuǎn)換,也就是說存在明確的轉(zhuǎn)換規(guī)則,可以實現(xiàn)字符<->二進制的相互轉(zhuǎn)換。
這里提到的轉(zhuǎn)換規(guī)則,其實就是我們經(jīng)常聽到的字符集&字符編碼。
字符集是一系列字符(文字、標點符號等)的集合。字符集有很多,常見的有ASCII、Unicode、GBK等。不同字符集主要的區(qū)別在于包含字符個數(shù)的不同。
了解了字符集的概念后,接下來介紹下字符編碼。
字符集告訴我們支持哪些字符,但具體字符怎么編碼,是由字符編碼決定的。比如Unicode字符集,支持的字符編碼有UTF8(常用)、UTF16、UTF32。
概括一下:
字符集:字符的集合,不同字符集包含的字符數(shù)不同。
字符編碼:字符集中字符的實際編碼方式。
一個字符集可能有多種字符編碼方式。
可以把字符編碼看成一個映射表,客戶端、服務端就是根據(jù)這個映射表,來實現(xiàn)字符跟二進制的編解碼轉(zhuǎn)換。
舉個例子,'你'這個字符,在UTF8編碼中,占據(jù)三個字節(jié)0xe4 0xbd 0xa0
,而在GBK編碼中,占據(jù)兩個字節(jié)0xc4 0xe3
。
上面已經(jīng)提到了字符編解碼所需的基礎(chǔ)知識。下面我們看一個簡單的例子,這里借助了icon-lite
這個庫來幫助我們實現(xiàn)編解碼的操作。
可以看到,在字符編碼時,我們采用了gbk
。在解碼時,如果同樣采用gbk
,可以得到原始的字符。而當我們解碼時采用utf8
時,則出現(xiàn)了亂碼。
var iconv = require('iconv-lite');
var oriText = '你';
var encodedBuff = iconv.encode(oriText, 'gbk');
console.log(encodedBuff);
//
var decodedText = iconv.decode(encodedBuff, 'gbk');
console.log(decodedText);
// 你
var wrongText = iconv.decode(encodedBuff, 'utf8');
console.log(wrongText);
// ??
通常我們需要處理編解碼的場景有文件讀寫、網(wǎng)絡(luò)請求處理。這里距網(wǎng)絡(luò)請求的例子,介紹如何在服務端進行編解碼。
假設(shè)我們運行著如下http服務,監(jiān)聽來自客戶端的請求??蛻舳藗鬏敂?shù)據(jù)時采用了gbk
編碼,而服務端默認采用的是utf8
編碼。
如果此時采用默認的utf8
對請求進行解碼,就會出現(xiàn)亂碼,因此需要特殊處理。
服務端代碼如下(為簡化代碼,這里跳過了請求方法、請求編碼的判斷)
var http = require('http');
var iconv = require('iconv-lite');
// 假設(shè)客戶端采用post方法,編碼為gbk
var server = http.createServer(function (req, res) {
var chunks = [];
req.on('data', function (chunk) {
chunks.push(chunk)
});
req.on('end', function () {
chunks = Buffer.concat(chunks);
// 對二進制進行解碼
var body = iconv.decode(chunks, 'gbk');
console.log(body);
res.end('HELLO FROM SERVER');
});
});
server.listen(3000);
對應的客戶端代碼如下:
var http = require('http');
var iconv = require('iconv-lite');
var charset = 'gbk';
// 對字符'你'進行編碼
var reqBuff = iconv.encode('你', charset);
var options = {
hostname: '127.0.0.1',
port: '3000',
path: '/',
method: 'POST',
headers: {
'Content-Type': 'text/plain',
'Content-Encoding': 'identity',
'Charset': charset // 設(shè)置請求字符集編碼
}
};
var client = http.request(options, function(res) {
res.pipe(process.stdout);
});
client.end(reqBuff);