jsonp是一種跨域解決方案，它通過(guò)將數(shù)據(jù)封裝在函數(shù)調(diào)用中并動(dòng)態(tài)地添加script標(biāo)簽到頁(yè)面上來(lái)實(shí)現(xiàn)跨域請(qǐng)求數(shù)據(jù)。然而，某些情況下我們需要將jsonp轉(zhuǎn)化為json格式進(jìn)行處理，這時(shí)候就需要使用axios來(lái)解決問(wèn)題了。

使用axios實(shí)現(xiàn)jsonp轉(zhuǎn)json，其實(shí)只需要向服務(wù)器發(fā)送jsonp請(qǐng)求，然后在返回?cái)?shù)據(jù)的函數(shù)中使用JSON.parse()來(lái)轉(zhuǎn)化為json格式即可。

// 使用axios實(shí)現(xiàn)jsonp轉(zhuǎn)化為json
axios.get('/api/getData', {
params: {
// 參數(shù)配置
callback: 'jsonpCallback'
}
}).then(res =>{
// 將jsonp轉(zhuǎn)化為json
const json = JSON.parse(res.data.replace('jsonpCallback(', '').replace(');', ''));
console.log(json);
}).catch(err =>{
console.log(err);
});

在代碼中，我們首先使用axios向服務(wù)器發(fā)送了一個(gè)jsonp請(qǐng)求，并指定了一個(gè)參數(shù)callback來(lái)告訴服務(wù)器返回?cái)?shù)據(jù)時(shí)，我們需要將數(shù)據(jù)封裝在一個(gè)名為jsonpCallback的函數(shù)調(diào)用中。然后，在獲取數(shù)據(jù)的操作中，使用JSON.parse()函數(shù)將數(shù)據(jù)轉(zhuǎn)化為了json格式。需要注意的是，在parse之前，我們需要對(duì)返回的數(shù)據(jù)進(jìn)行一些處理，包括將函數(shù)名jsonpCallback和括號(hào)都刪除，否則解析將會(huì)失敗。

最后，我們可以通過(guò)控制臺(tái)輸出json對(duì)象來(lái)檢查是否成功解析：

{
name: "axios jsonp to json",
method: "GET",
data: {
name: "json data",
dataInfo: [
{
id: 1,
title: "title1",
content: "content1"
},
{
id: 2,
title: "title2",
content: "content2"
}
]
}
}

可以看到，我們已經(jīng)成功將jsonp轉(zhuǎn)化為了json格式，這在某些場(chǎng)景下將具有非常重要的作用。