Espero que sea útil para todos. Si es útil, ¡deje un me gusta y un comentario para hacerme saber que este método puede ayudar a todos! (Aunque mi método es muy salvaje)
origen
Recientemente estaba completando un proyecto en el que la dirección API de back-end y la dirección de front-end eran inconsistentes, lo que involucraba problemas entre dominios.
Dado que se agrega una capa de Nginx al servidor como antigeneración, es natural pensar en agregar algunas oraciones.conf
al archivo de configuración :add_header
location XXXX {
# 此处省略一万字
#CORS 配置
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
#是否允许cookie传输
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,X-Data-Type,X-Requested-With,X-Data-Type,X-Auth-Token';
#针对浏览器的options预请求直接返回200,否则会被403 forbidden--invalie CORS request
if ( $request_method = 'OPTIONS' ) {
return 200;
}
# 此处省略一万字
}
¡Pero, pero ! Después de guardar la configuración y reiniciar Nginx, descubrí que las declaraciones que agregué add_header
no funcionaban.
Revisé mucha información y algunos dijeron que era un problema de herencia, pero revisé por un tiempo y no pude encontrar ningún problema de herencia. Lo implementé yo mismo usando Pagoda, ¡y fue molesto mirar las capas de archivos de configuración allí include
! ¡débil! ¡Se fue en un abrir y cerrar de ojos de la noche a la mañana!
Sin embargo, después de algunos intentos a ciegas, accidentalmente descubrí una solución factible——
La solución que probé yo mismo.
Es decir, ¡una capa de declaraciones if!
La configuración modificada es la siguiente:
set $enable_cors 0;
if ( $enable_cors = 0 )
{
#CORS 配置
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
#是否允许cookie传输
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,X-Data-Type,X-Requested-With,X-Data-Type,X-Auth-Token';
}
#针对浏览器的options预请求直接返回200,否则会被403 forbidden--invalie CORS request
if ( $request_method = 'OPTIONS' ) {
#CORS 配置
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
#是否允许cookie传输
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,X-Data-Type,X-Requested-With,X-Data-Type,X-Auth-Token';
return 200;
}
¡Recuerde pegar la configuración de nginx anterior en la location
sección correspondiente a continuación!
Después de unirse, asegúrese de reiniciar Nginx para que la configuración surta efecto.
La medición real es factible: