Как добавить заголовок в axios.create в приложении react/redux
Я пытаюсь получить доступ к данным JSON, используя axios.create в моем приложении для реагирования на редукцию. Я установил преобразователь в качестве промежуточного программного обеспечения. Я получаю сообщение об ошибке «Нет заголовка Access-Control-Allow-Origin в запрошенном ресурсе». Из того, что я прочитал в Интернете, я мог бы решить эту проблему, добавив заголовки в вызов axios.create. Как мне это сделать?
//api file
import axios from 'axios';
export default axios.create({
baseURL: 'https://www.thehomelike.com/search/'
})
//actions/index.js
import jsonPlaceholder from '../apis/jsonPlaceholder';
export const fetchPosts = () => {
return async dispatch => {
const response = await jsonPlaceholder.get('DE/Berlin?country=DE&east=13.499539418719593&lang=en-GB&lat=52.52000659999999&lng=13.404953999999975&locality=Berlin&mapLimit=24&north=52.5942101138977&south=52.445677542691186&west=13.310368581316283');
dispatch({ type: 'FETCH_POSTS', payload: response })
}
}
Это заголовки в соответствии с сетевым инструментом Chrome.
Response Headers:
access-control-allow-credentials: true
access-control-allow-headers: authorization
access-control-allow-methods: GET,HEAD,PUT,PATCH,POST,DELETE
access-control-allow-origin: https://www.thehomelike.com
date: Mon, 01 Apr 2019 06:23:11 GMT
server: nginx
status: 204
vary: Origin, Access-Control-Request-Headers
x-powered-by: Express
Ответы 2
Не могли бы вы попробовать использовать Postman для отправки запроса? Если Postman может отправить ваш запрос, эта ошибка исходит от вашего сервера. Если вы используете Express, этот фрагмент кода может помочь U, однако активирует CORS для всех ресурсов на вашем сервере.
var express = require('express');
var app = express();
app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});
Вы можете создать экземпляр axios с заголовком по умолчанию как
const request = axios.create({
baseURL: 'https://www.thehomelike.com/search/',
headers: { // ...your headers}
});
Проблема, с которой вы столкнулись, может быть решена и на стороне server.
Вы должны обновить политики сервера, чтобы разрешить CORS. Если у вас есть сервер в node-express, вы можете попробовать этот https://www.npmjs.com/package/cors
Какие я включаю? Я включил все заголовки ответов в нижней части сообщения.
Я думаю, вместо того, чтобы редактировать запрос, вы должны изменить политики своего сервера.
у меня нет доступа к серверу
Почтальон может отправить запрос, поэтому он загружает файл JSON.