Necesitamos tu ayuda para extender nuestras reseñas acerca de las ciencias de la computación.
Solución:
CORS es el servidor que le dice al cliente qué tipo de solicitudes HTTP puede realizar. Cada vez que veas un Access-Control-Allow-* encabezado, estos deben ser enviados por el servidor, NO por el cliente. El servidor está “permitiendo” que el cliente envíe ciertos encabezados. No tiene sentido que el cliente se dé permiso a sí mismo. Así que elimine estos encabezados de su código de interfaz.
axios.defaults.headers.common['Access-Control-Allow-Origin'] = '*';
this.axios.post('http://localhost:8888/project/login', this.data,
headers:
// remove headers
).then(res =>
console.log(res);
).catch(err =>
console.log(err.response);
);
Por ejemplo, imagine que su backend establece este encabezado cors.
header("Access-Control-Allow-Methods: GET");
Eso significa que un cliente de un origen diferente solo puede enviar solicitudes GET, por lo que axios.get trabajaría, axios.post fallaría, axios.delete fallaría, etc
Esto puede ocurrir: está intentando llamar a otro host por ejemplo: la aplicación You Vue se está ejecutando en localhost: 8080 pero su API de back-end se está ejecutando en http://localhost: 8888 En esta situación, la solicitud de axios busca este localhost: 8080/project/login en lugar de este http://localhost:8888/project/login
Para resolver este problema, debe crear un proxy en su aplicación vue
Siga estas instrucciones Cree el archivo js vue.config.js o webpack.config.js si aún no lo tiene dentro de la carpeta raíz
luego incluir a continuación
module.exports =
devServer:
proxy: 'https://localhost:8888'
Si necesita múltiples backends, use a continuación
module.exports = {
devServer:
proxy:
'/V1':
target: 'http://localhost:8888',
changeOrigin: true,
pathRewrite:
'^/V1': ''
,
'/V2':
target: 'https://loclhost:4437',
changeOrigin: true,
pathRewrite:
'^/V2': ''
,
Si selecciona el segundo delante del punto final, use V1 o V2 ex – su punto final es /project/login antes de usar V1/project/login o V2/project/login según el host
en mi caso curl && postman funciona pero no vue axios.post
El acceso a XMLHttpRequest en ‘http://%%%%:9200/lead/_search’ desde el origen ‘http://%%%%.local’ ha sido bloqueado por la política de CORS: campo de encabezado de solicitud access-control-allow- El origen no está permitido por Access-Control-Allow-Headers en la respuesta de verificación previa.
Entonces, ¡el problema está en el lado de vue, no en el servidor!
La respuesta del servidor contiene el encabezado “access-control-allow-origin: *”
Recuerda algo, que te brindamos la opción de parafrasear .