WebSocket如何在HTTP請求中添加自定義請求頭

一、WebSocket基礎知識回顧

WebSocket是瀏覽器內置的一種協議，可以建立客戶端與伺服器之間的雙向通信通道。其實WebSocket協議就是基於HTTP的擴展協議，在建立連接的時候需要藉助HTTP，在建立WebSocket連接之後，數據的傳輸就不再使用HTTP了。

舉個例子，如果客戶端需要與伺服器建立WebSocket連接，會先向伺服器發送一個HTTP請求，請求頭中包含了Upgrade欄位表示要升級協議，然後伺服器返回的HTTP響應中包含了Upgrade欄位，並且值為WebSocket，這樣連接就建立了，之後所有的數據傳輸都是基於WebSocket協議進行的。而此次問題關鍵點則是如何在該HTTP請求頭中添加自定義欄位。

二、HTTP請求添加自定義請求頭的方法

在建立WebSocket連接之前，我們需要先了解如何在HTTP請求中添加自定義請求頭：

const socket = new WebSocket('your_websocket_url');
socket.onopen = function(event) {
  var requestHeader = {'key1': 'value1', 'key2': 'value2'};
  socket.send(JSON.stringify({'request_header': requestHeader}));
}

以上代碼中我們可以看到在建立WebSocket連接之前，我們定義了一個請求頭對象requestHeader。在WebSocket連接建立之後，通過socket.send()方法將該對象序列化為JSON字元串然後發送到伺服器，就可以實現在HTTP請求中添加自定義請求頭的目的了。

三、實現WebSocket添加自定義請求頭的示例代碼

以下是一個完整的實例代碼，其中自定義請求頭使用的是Authorization欄位，其值為令牌（toke）：

const socket = new WebSocket('your_websocket_url');
const authorization = 'Bearer ' + your_token;
const requestHeader = {'Authorization': authorization};
  
socket.onopen = function(event) {
  socket.send(JSON.stringify({'request_header': requestHeader}));
};

在上述示例代碼中，我們定義了一個authorization常量表示令牌，然後定義了一個requestHeader請求頭對象，該請求頭對象包含了Authorization欄位和其對應的值，最後將該請求頭對象序列化為JSON字元串，使用socket.send()方法發送到伺服器即可。

四、小結

在WebSocket建立連接之前，我們可以利用HTTP請求添加自定義請求頭的方式來實現自己的需求，例如在請求頭中添加token、Authorization欄位等，這些自定義欄位可以用於驗證用戶身份、授權訪問等。

本文主要為不熟悉WebSocket的讀者介紹了WebSocket的基本概念，並且詳細闡述了在HTTP請求中如何添加自定義請求頭的方法和示例代碼。