El servidor Express y la respuesta Preflight de Axios CORS no tienen éxito

Tengo la siguiente acción Get mediante el uso de react.js (que se ejecuta en el puerto 3000)

var config = { headers: { 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type, Accept', // 'Accept': 'application/json', // 'Content-Type': 'application/json', } }; axios.get(api_url + '/schools/countries/' + country, config) .catch(err => { alert('There was an error trying to fetch', country) }) .then(response => { ..... } 

Y estoy usando un proxy para enviar eso a un servidor Express que se ejecuta en el puerto 3001. El archivo App.js en el servidor Express es el siguiente:

 var express = require('express'); var app = express(); var cors = require('cors') app.set('views', path.join(__dirname, 'views')); app.set('view engine', 'jade'); // uncomment after placing your favicon in /public //app.use(favicon(path.join(__dirname, 'public', 'favicon.ico'))); //app.use(logger('dev')); // app.use(function(req, res, next) { // res.header("Access-Control-Allow-Origin", "*"); // res.header("Access-Control-Allow-Methods", "GET,HEAD,OPTIONS,POST,PUT"); // res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Authorization"); // next(); // }); app.all('*', function(req, res, next) { res.header('Access-Control-Allow-Origin', 'URLs to trust of allow'); res.header('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE'); res.header('Access-Control-Allow-Headers', 'Content-Type'); if ('OPTIONS' == req.method) { res.sendStatus(200); } else { next(); } }); //app.use(cors()) app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: false })); app.use(cookieParser()); app.use(express.static(path.join(__dirname, 'public'))); app.use('/', index); app.use('/users', users); app.use('/schools', schools); console.log("IN APP.JS"); // catch 404 and forward to error handler app.use(function(req, res, next) { var err = new Error('Not Found'); err.status = 404; next(err); }); // error handler app.use(function(err, req, res, next) { // set locals, only providing error in development res.locals.message = err.message; res.locals.error = req.app.get('env') === 'development' ? err : {}; // render the error page res.status(err.status || 500); res.render('error'); }); module.exports = app; 

Y por alguna razón me sale los siguientes errores:

[Error] Error al cargar el recurso: la respuesta de verificación previa no es exitosa (MR, línea 0)

[Error] XMLHttpRequest no puede cargar http: // localhost: 3000 / schools / countries / MR . La respuesta antes del vuelo no es exitosa

En el lado de reacción (front-end) tengo este es el archivo package.json:

 "proxy": "http://localhost:3001", 

He intentado usar diferentes encabezados en el archivo App.js y he intentado usar la biblioteca cors para hacer que esto funcione, etc. ¿Cómo puedo corregir este error?

¡Gracias!

Encontré la solución. El problema que 1. Tenía que quitar los encabezados de la parte delantera. La segunda cosa, y probablemente la más importante, es que cuando haces una llamada de axios usando un proxy, no debes hacer esto:

var api_url= "http:localhost" axios.get(api_url + '/schools/countries/' + country)

Usted debe hacer esto:

 axios.get('/schools/countries/' + country) 

sin la parte localhost.