在前端開發中，header是Web請求中非常重要的一部分。通常情況下，header在瀏覽器向服務器發送請求時會被自動添加，其中包括了請求的方法、路徑、請求頭等信息。然而，在有些情況下，我們需要手動添加header來實現一些特殊的功能，例如在請求中加入認證信息、調用第三方API等。在Vue.js中，我們可以使用Axios庫來發送HTTP請求，并在請求中添加自定義header。

// npm install axios --save
import axios from 'axios';
axios.defaults.baseURL = 'http://api.example.com/';
axios.defaults.headers.common['Authorization'] = 'Bearer ' + localStorage.getItem('token');
axios.post('/users', {
name: 'John Smith',
age: 25
});

以上代碼定義了一個基礎URL，然后在請求header中添加了一個名為Authorization的字段，并以Bearer開頭+token的方式傳遞用戶登錄信息。在發送請求時，我們可以簡單地通過Axios庫的post方法發送JSON數據。

然而，在實際應用中，我們經常遇到的情況是需要在多個組件中使用相同的header。為了避免在每個組件中都手動添加header，我們可以使用Vue.js的全局守衛來實現全局添加自定義header的功能。

import axios from 'axios';
axios.defaults.baseURL = 'http://api.example.com/';
router.beforeEach((to, from, next) =>{
const token = localStorage.getItem('token');
if (token) {
axios.defaults.headers.common['Authorization'] = 'Bearer ' + token;
} else {
axios.defaults.headers.common['Authorization'] = null;
}
next();
});

以上代碼中，我們在Vue路由中定義了一個全局守衛。它會在任何路由切換之前執行，然后根據用戶登錄狀態添加自定義header。如果用戶已經登錄，我們將指定的Authorization頭中加入token；如果用戶未登錄，則將Authorization置為null。隨后，請求就會攜帶相應的header。

在某些情況下，我們可能需要在全局header中加入更多的信息。例如，添加一個Content-Type頭來指定請求數據格式為application/json。你可以像下面這樣修改全局守衛。

router.beforeEach((to, from, next) =>{
const token = localStorage.getItem('token');
if (token) {
axios.defaults.headers.common['Authorization'] = 'Bearer ' + token;
} else {
axios.defaults.headers.common['Authorization'] = null;
}
axios.defaults.headers.common['Content-Type'] = 'application/json';
next();
});

以上代碼還指定了Content-Type格式，確保所有的請求都發送JSON數據。

在Vue.js中使用全局header的另一個優點是，我們可以避免在每個組件中手動添加相同的header。這樣，我們可以更專注于業務邏輯的實現，提高開發效率。

Vue.js是一個適合開發Web應用的漸進式框架，同時也提供了豐富的工具和插件。使用全局header功能可以幫助我們更快地完成Web請求，同時提高代碼的可靠性。