发布于 4年前

配置Nginx解决:Incompatibile SockJS! Main site uses: "1.1.5", the iframe: "1.0.0"

前端使用ant-design开发,后端是由很多微服务构成,为了统一访问入口,在前端与后端之间使用了Nginx做代理。前后端直接调用服务是没有报错的,使用Nginx代理后,报sockejs的错误。错误信息:

Incompatibile SockJS! Main site uses: "1.1.5", the iframe: "1.0.0"

查了下,原因ant-design的热更新是通过websocket的,nginx需要配置对nginx的支持。

打开nginx配置文件,nginx.conf,在server节点的配置中对websocket的url做拦截,示例配置如下:

server {
    listen       80;
    server_name  example.com;
    charset utf-8;
    location /websocket/ {
       proxy_http_version 1.1;
       proxy_set_header Upgrade $http_upgrade;
           proxy_set_header Connection "upgrade";
           proxy_pass http://127.0.0.1:3000;
       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_connect_timeout 60;
           proxy_read_timeout 600;
       proxy_send_timeout 600;
    }
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
}

关键配置:

  • location /websocket/:配置拦截的websocket路径,根据请求的url前缀调整。
  • proxy_http_version 1.1:websocket是在http1.1上扩展的。
  • proxy_set_header Upgrade $http_upgrade 和proxy_set_header Connection "upgrade":告诉nginx升级协议为websocket
©2020 edoou.com   京ICP备16001874号-3