<p>Recently, in the project docking with the backend, the interface tool uses the < code > Axios < / code > thing. Anyway, there are many pits. In the back-end request, set < code > get < / code > request, set < code > content type < / code > in < code > header < / code > to < code > Application / JSON; charset = UTF-8 < / code ></p>
I watched it for two seconds. It's easy
var $http = axios.create({
baseURL: url,
headers: {
'Content-Type': 'application/json; charset=utf-8'
}
...
})
Is it easy to sprinkle water
Then? Then? what fuck? I don't have this in the header in the request, but except for the content type, it can be set
At this moment, 10000 sentences of mmp will be pushed, and Baidu's push is useless
Then I went to read the source code of ha ha, the source code axios/lib/xhr.js in the npm package. What did I write? What did I write
Line 118-129
// Add headers to the request if ('setRequestHeader' in request) { utils.forEach(requestHeaders, function setRequestHeader(val, key) { if (typeof requestData === 'undefined' && key.toLowerCase() === 'content-type') { // Remove Content-Type if data is undefined delete requestHeaders[key]; } else { // Otherwise add header to the request request.setRequestHeader(key, val); } }); }/pre>
And look at this
if
Sentence segment, The dog was beheaded.Then there are a few solutions. I'll write next
Method 1
//Modify this code // Add headers to the request if ('setRequestHeader' in request) { utils.forEach(requestHeaders, function setRequestHeader(val, key) { //if (typeof requestData === 'undefined' && key.toLowerCase() === 'content-type') { // Remove Content-Type if data is undefined //delete requestHeaders[key]; //} else { // Otherwise add header to the request request.setRequestHeader(key, val); //} }); }
All right, all right, now
- Method two
We can't change people's npm package at will. In case that they don't have to change it next time they install it, what should we do? Look at the following method
var $http
// Add a new axios instance
$http = axios.create({
baseURL: url,
headers: {
'Content-Type': 'application/json; charset=utf-8'
}
})
// Add request interceptor
$http.interceptors.request.use(function (config) {
// What to do before sending the request
// Write a value to bypass if judgment
if (config.method == 'get') {
config.data = true
}
config.headers['H-TOKEN'] = '111'
return config;
}, function (error) {
// What to do about request errors
return Promise.reject(error);
});
Now my brother tells you, it's not easy to set the header in the get request
The reason why axios does this is that the GET request itself does not need content type, and the tower is a simple request
Now go to the official website and ask for a bug. They will adopt it