Nginx解决跨域问题(含websocket)

2020-01-12  本文已影响0人  XJ2017

1、普通Web应用跨域解决(统一添加允许的Header,直接响应options请求)

# 在nginx配置代理的文件(/etc/nginx/sites-available/api.**.com)中添加如下内容
server {
    listen   80;
    server_name api.**.com;
    location / {
        proxy_pass http://127.0.0.1:8080;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-forwarded-For $proxy_add_x_forwarded_for;

        add_header 'Access-Control-Allow-Origin' $http_origin;
        add_header 'Access-Control-Allow-Methods' '*';
        add_header 'Access-Control-Allow-Credentials' 'true';
        add_header 'Access-Control-Allow-Headers' 'X-API-KEY,Origin,X-Requested-With,Content-Type,Accept,Authorization,username,signature';
        add_header 'Content-Type' 'application/json;charset=UTF-8';

        if ($request_method = 'OPTIONS') {
            return 204;
        }
    }
}

2、带websocket的Web应用跨域解决(在满足1的情况下,剔除websocket建立连接的Get请求,因为建立websocket的Get请求在启动配置已经解决了跨域问题:setAllowedOrigins("*"))
注意:尝试剔除setAllowedOrigins("*"),但不生效

import org.springframework.context.annotation.Configuration;
import org.springframework.messaging.simp.config.ChannelRegistration;
import org.springframework.messaging.simp.config.MessageBrokerRegistry;
import org.springframework.scheduling.concurrent.ThreadPoolTaskScheduler;
import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;
import org.springframework.web.socket.config.annotation.StompEndpointRegistry;
import org.springframework.web.socket.config.annotation.WebSocketMessageBrokerConfigurer;

@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {

    @Override
    public void configureMessageBroker(MessageBrokerRegistry config) {
        ...
    }

    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/websocket").setAllowedOrigins("*").withSockJS()
            .setClientLibraryUrl("/webjars/sockjs-client/1.0.2/sockjs.min.js");
    }

    @Override
    public void configureClientInboundChannel(ChannelRegistration registration) {
        ...
    }

}
# 在nginx配置代理的文件(/etc/nginx/sites-available/api.**.com)中添加如下内容
server {
    listen   80;
    server_name api.**.com;
    # 在nginx配置代理的文件(/etc/nginx/sites-available/api.**.com)中添加
    location / {
        proxy_pass http://127.0.0.1:8080;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection  "upgrade";

        if ($request_method = 'OPTIONS') {
            add_header 'Access-Control-Allow-Origin' $http_origin;
            add_header 'Access-Control-Allow-Methods' '*';
            add_header 'Access-Control-Allow-Credentials' 'true';
            add_header 'Access-Control-Allow-Headers' 'X-API-KEY,Origin,X-Requested-With,Content-Type,Accept,Authorization,username,signature';
            add_header 'Content-Type' 'application/json;charset=UTF-8';
            return 204;
        }

        set $fill_header 0;
        if ($request_method = 'GET') {
            set $fill_header 1;
        }
        # 此处的websocket就是上送代码中的registry.addEndpoint("/websocket"),用于定义Http连接地址
        if ($request_uri ~* '^/websocket/\S+') {
            set $fill_header ${fill_header}1;
        }

        if ($fill_header != 11) {
            add_header 'Access-Control-Allow-Origin' $http_origin;
            add_header 'Access-Control-Allow-Methods' '*';
            add_header 'Access-Control-Allow-Credentials' 'true';
            add_header 'Access-Control-Allow-Headers' 'X-API-KEY,Origin,X-Requested-With,Content-Type,Accept,Authorization,username,signature';
            add_header 'Content-Type' 'application/json;charset=UTF-8';
        }
    }
}
上一篇 下一篇

猜你喜欢

热点阅读