在進(jìn)行前端開發(fā)過(guò)程中，經(jīng)常需要向后端服務(wù)器發(fā)送請(qǐng)求，獲取數(shù)據(jù)并進(jìn)行相應(yīng)的操作。而在請(qǐng)求過(guò)程中，很可能會(huì)遇到一些錯(cuò)誤或異常情況，比如返回狀態(tài)碼為304的情況。

那么，什么是狀態(tài)碼304呢？狀態(tài)碼304是HTTP協(xié)議中的一種服務(wù)器響應(yīng)狀態(tài)碼，表示“未修改”，通常用于緩存控制。當(dāng)瀏覽器或客戶端向服務(wù)器發(fā)起請(qǐng)求時(shí)，如果服務(wù)器的數(shù)據(jù)沒有發(fā)生改變，就會(huì)返回304狀態(tài)碼表示數(shù)據(jù)未被修改，瀏覽器或客戶端就會(huì)讀取本地的緩存數(shù)據(jù)。這樣可以有效地減輕服務(wù)器的壓力和提高請(qǐng)求效率。

下面介紹如何使用axios請(qǐng)求本地json文件，并處理304狀態(tài)碼。

//引入axios庫(kù)
import axios from 'axios'
//發(fā)送GET請(qǐng)求
axios.get('/data.json', {
//設(shè)置請(qǐng)求頭
headers: {
'If-Modified-Since': 'Thu, 01 Jun 2021 00:00:00 GMT' //設(shè)置上次修改時(shí)間
},
//開啟緩存
cache: true
}).then(res =>{
//處理響應(yīng)數(shù)據(jù)
const data = res.data
console.log(data)
}).catch(err =>{
//處理請(qǐng)求異常
console.log(err)
})

代碼中，我們使用axios庫(kù)向服務(wù)器發(fā)送GET請(qǐng)求，請(qǐng)求本地的data.json文件。在請(qǐng)求過(guò)程中，我們?cè)O(shè)置了 If-Modified-Since 請(qǐng)求頭，該請(qǐng)求頭表示上次修改時(shí)間，用于與服務(wù)器進(jìn)行比較判斷是否需要獲取最新的數(shù)據(jù)。同時(shí)，我們還開啟了緩存，這樣可以讀取本地的緩存數(shù)據(jù)，避免重復(fù)請(qǐng)求。

在響應(yīng)數(shù)據(jù)中，我們通過(guò) res.data 獲取到服務(wù)器返回的數(shù)據(jù)，并進(jìn)行相應(yīng)的操作。在請(qǐng)求失敗時(shí)，我們可以通過(guò) catch 方法進(jìn)行異常處理，在控制臺(tái)輸出錯(cuò)誤信息。

在實(shí)際開發(fā)中，我們需要根據(jù)具體的業(yè)務(wù)場(chǎng)景進(jìn)行適當(dāng)調(diào)整。如果有需要，可以參考官方文檔進(jìn)行更進(jìn)一步的定制化開發(fā)實(shí)現(xiàn)。