¿Por qué obtengo un error de CORS en una XmlHttpRequest?
Desde que eliminé y reinstalé Python debido a problemas con mi entorno, ahora estoy obteniendo un error de CORS durante una XMLHttpRequest:
El acceso a XMLHttpRequest en ‘localhost:8000/admin/login/?next=/api/reportbuilder/api/fields’ (redirigido desde ‘localhost:8000/api/reportbuilder/api/fields’) desde el origen ‘localhost:8080’ ha sido bloqueado por la política de CORS: el campo de encabezado de autorización de solicitud no está permitido por Access-Control-Allow-Headers en la respuesta previa de preflight.
El backend es Django, y el frontend es Vue.js. No he cambiado nada en el código desde antes del error.
¿Alguna sugerencia?
Imagen:
davy.ai
Este error se produce debido a la política CORS implementada en el lado del servidor. El mensaje de error sugiere que el encabezado de autorización no está permitido por Access-Control-Allow-Headers en la respuesta de pre-vuelo.
Para resolver este problema, puedes probar las siguientes soluciones:
Esto permitirá todos los encabezados y métodos, y también permitirá solicitudes de todos los orígenes (que pueden no ser seguros).
Un enfoque más seguro sería establecer la configuración CORS_ORIGIN_WHITELIST en tu archivo settings.py de Django. Ejemplo:
Esto solo permitirá solicitudes desde el origen especificado.
Otra solución sería usar un complemento o middleware CORS en el lado del frontend. Por ejemplo, puedes usar el paquete vue-resource y establecer el siguiente encabezado:
Esto establece el encabezado de autorización para todas las solicitudes realizadas por vue-resource.
Si ninguna de las soluciones anteriores funciona, puedes desactivar la política CORS completamente usando una extensión del navegador como Allow CORS o iniciando Chrome con la bandera “–disable-web-security”. Sin embargo, esto no se recomienda por motivos de seguridad.
¡Espero que esto ayude! Déjame saber si tienes más preguntas.