如何在fetch/axios跨站點請求上使用JSONP

Question

我試圖在wikipedia API上執行GET請求。使用jQuery如下工作正常：

$.ajax({ 
    url: 'https://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrnamespace=0&gsrlimit=10&prop=pageimages|extracts&pilimit=max&exintro&explaintext&exsentences=1&exlimit=max&gsrsearch=Test&callback=JSON_CALLBACK', 
    type: 'GET', 
    headers: {'X-Requested-With': 'XMLHttpRequest'}, 
    crossDomain: true, 
    dataType: 'jsonp' 
}).done(function(data) { 
    console.log("Data: ", data); 
}); 

但我想用提取或愛可信API，它在飛行前停止與請求方法：選項。爲什麼它在jQuery中工作，但不在其他API中？

axios.get('https://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrnamespace=0&gsrlimit=10&prop=pageimages|extracts&pilimit=max&exintro&explaintext&exsentences=1&exlimit=max&gsrsearch=Test&callback=JSON_CALLBACK', 
    { headers: {'X-Requested-With': 'XMLHttpRequest', 
       'content-type': 'text/plain'} 
    }) 
    .then(function (response) { 
     console.log("Response: ", response); 
    }); 

我發現它可能與GET請求的內容類型，jQuery的默認似乎是text/plain的，但試圖改變內容時，我沒有成功 - 正在發送爲text/html的提取/ axios請求類型。

有什麼想法可能是什麼問題？

Answer 1

我發現問題與請求的內容類型無關。

問題是由於API（提取和axios）不支持jsonp請求。使用JSONP OS我來說不明確的，我可以在這裏找到一個很好的解釋：https://stackoverflow.com/a/6879276/4051961

雖然他們不支持的話，他們提供替代方案來執行JSONP請求：

愛可信： https://github.com/mzabriskie/axios/blob/master/COOKBOOK.md#jsonp
獲取：https://www.npmjs.com/package/fetch-jsonp

Answer 2

推薦的方式與愛可信訪問JSONP實際上是不使用愛可信：

1. The Discussion on Why (not)

2. A similar question

3. Alternative Suggestion from Axios

總之安裝：

npm install jsonp --save 

使用它像：

var jsonp = require('jsonp'); 

jsonp('http://www.example.com/foo', null, function (err, data) { 
    if (err) { 
    console.error(err.message); 
    } else { 
    console.log(data); 
    } 
});