令人沮丧的问题。我在一个服务器上创建了一个react项目,该服务器必须使用Nginx进行外部连接/HTML服务器。本质上我需要做的是使用nginx作为代理服务器,当URL被输入浏览器时,请求被路由到localhost:3000,react应用程序生成结果,并由nginx提供给客户端。
这是到目前为止的nginx文件,但我无法让它工作。一些问题:
根指定是否需要指向react项目中的/public目录以获取索引。html?
假设你跑了 npm start 编译完成后,在浏览器中输入FQDN,它将路由到localhost:3000
npm start
到目前为止,我的Nginx配置
server_name server-name.com; listen 443 ssl; ssl_certificate /etc/letsencrypt/live/site-name/fullchain.pem; ssl_certificate_key /etc/letsencrypt/live/site-name/privkey.pem; ssl_protocols TLSv1 TLSv1.1 TLSv1.2; ssl_ciphers HIGH:!aNULL:!MD5; proxy_read_timeout 60s; client_max_body_size 64M; # should this be routed to /public in the react project to pick up index.html? # root /var/www/html; index index.html index.htm; location / { #try_files $uri $uri/ =404; # Make sure React Application return is index.html so client routing remains in sync/reachable #try_files $uri /index.html; proxy_pass http://localhost:3000; 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; } location /_api { rewrite ^/_api/(.+) /$1 break; include uwsgi_params; uwsgi_pass 127.0.0.1:3030; } } server { server_name server-name.com listen 80; allow 10.0.0.0/16; deny all; proxy_read_timeout 60s; client_max_body_size 64M; # Should this be routed to /public in the react project to pick up index.html? # root /var/www/html; index index.html index.htm; location / { #try_files $uri $uri/ =404; # Make sure React Application return is index.html so client routing remains in sync/reachable try_files $uri /index.html; } location /_api { include uwsgi_params; uwsgi_pass 127.0.0.1:3030; } }
打开你的nginx file vi sites enabled/default,如果你不知道怎么做,请告诉我。
然后从该文件中删除所有内容并简单粘贴:
server { listen 80; client_max_body_size 10M; server_name YourWebsiteNameWithDomain yourIPV4; location / { proxy_pass http://127.0.0.1:3000; 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; } }
别忘了重新启动nginx