reactjs - React.js、nginx 和 SSL

Question

我在 OVH 上买了一个 VPS，目前运行在 Debian 9 上。 我在默认端口(80 和 443)上成功安装了 SSL，它在显示基本 html 时运行良好。 但是，我完全不知道我的 react 应用程序(尝试配置的基本应用程序)的运行。 它适用于 Safari 中的 http，但在 Chrome 中根本不起作用:“此站点无法提供安全连接 wecode-it.fr 发送了无效响应。 ERR_SSL_PROTOCOL_ERROR”

我已经检查过我服务器的日期是正确的。 我正在使用 npm start 在本地运行我的应用程序，现在想使用开发模式。如果您对构建用于生产的应用程序有任何建议，我也会采纳。我想我会使用 docker，但我还不知道如何使用它。

这是我的 nginx 配置。

        listen 80 default_server;
        listen [::]:80 default_server;
        server_name wecode-it.fr www.wecode-it.fr;
        root /usr/share/nginx/html;
        index index.html;

        location ~ /.well-known {
                allow all;
        }
        return 301 https://$server_name$request_uri;
}

server {
        listen 443 ssl http2 default_server;
        listen [::]:443 ssl http2 default_server;
        ssl        on;
ssl_certificate /etc/letsencrypt/live/wecode-it.fr/fullchain.pem
ssl_certificate_key /etc/letsencrypt/live/wecode-it.fr/privkey.pem
ss_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_prefer_servers_ciphers on;
ssl_ecdh_curve secp384r1;
ssl_session_cache shared:SSL:10m;
ssl_session_tickets off; # Requires nginx >= 1.5.9
ssl_stapling on; # Requires nginx >= 1.3.7
ssl_stapling_verify on; # Requires nginx => 1.3.7
resolver 8.8.8.8 8.8.4.4 valid=300s;
resolver_timeout 5s;
add_header Strict-Transport-Security "max-age=63072000; includeSubdomains";
add_header X-Frame-Options DENY;
add_header X-Content-Type-Options nosniff;
ssl_dhparam /etc/ssl/certs/dhparam.pem;

 location / {
        proxy_pass https://MYIP:3030;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
  }
}

我可以回答你们的任何问题。 谢谢。

Answer 1

您必须决定是要使用代理还是直接。 缺少一些 ssl 设置(如果证书是本地的)。

但现在，您可以试试这个设置:

server {
    listen              443 ssl;
    server_name         backend1.example.com;

    ssl_certificate     /etc/ssl/certs/server.crt;
    ssl_certificate_key /etc/ssl/certs/server.key;
    #...
    location /yourapp {
        proxy_pass http://url_to_app.com;
        #...
    }
}

在文档中查看更多内容 https://docs.nginx.com/nginx/admin-guide/security-controls/securing-http-traffic-upstream/#configuring-upstream-servers