使用kubernetes在Nginx中部署React js构建目录

在Nginx服务器中部署React js(构建目录)静态文件。

使用kubernetes,我正在运行nginx服务器来为静态文件提供React js的“ build”目录。我可以在浏览器中访问简单的index.html。但不是带有react js代码的index.html。根目录中包含index.html文件,静态目录和其他文件。目录结构已复制到this路径。

nginx.conf如下所示

events {
    worker_connections  1024;
}
http {
    server {
        listen 80;
        root /usr/share/nginx/html;
    #index index.html;
        location / {
      index index.html; 
          try_files $uri $uri/index.html /index.html;
        }
    location /static/ { 
       autoindex on;
       root /usr/share/nginx/html/static/;
    }   
    }
}

在浏览器中,不会加载index.html,但是在源代码中(在浏览器中右键单击>选择源代码),index.html代码可用。在浏览器中从源复制的格式化的index.html文件位于this路径中。我预计javascript(css,js)代码未执行或在浏览器中加载时出现问题。否则,nginx配置会出现问题,无法加载javascript文件。

如何正确配置nginx来部署Reactjs构建目录文件?

wsydy2006 回答:使用kubernetes在Nginx中部署React js构建目录

try_files不会告诉nginx提供静态文件。在没有任何其他操作的情况下到达右大括号会导致其为静态文件提供服务。 try_files测试本地文件系统中文件的存在,并可能重写URL。

文件中有语法错误,即空格。

请记住要为nginx创建service-键入LoadBalancer并在部署配置文件中引用它。如果有多个与请求的IP地址和端口匹配的服务器,则必须添加服务器。

这是您应如何执行此过程的示例。确保您遵循了教程中的每个步骤:nginx-configuration-在PHP应用程序上有练习的示例,但是有相同的步骤可以用ReactJS应用程序重现。

您的conf文件应如下所示:

events {
    worker_connections  1024;
}
http {
    server {
        listen 80;
        root /usr/share/nginx/html;
        index index.html index.htm;
        server_name your_server_name_or_IP

        location / { 
            try_files $uri $uri/index.html /index.html;
        }

        location /static/ { 
            autoindex on;
            root /usr/share/nginx/html/static/;
        }   
   }
}
,

以下适用于我的代码。

server {
    listen 80;
    root /usr/share/nginx/html;
    index index.html index.htm;
    server_name xyz.application.com;
    server_name localhost; 
    location / { 
    ssi on;
    set $inc $request_uri;
    if (!-f $request_filename) {
        rewrite ^ /index.html last;
    }
    index index.html;
        try_files $uri $uri/index.html /index.html =404;
    }

设置重写重定向到index.html页面。我不确定ssi的影响,请在代码中设置$ inc $ request_uri。

本文链接:https://www.f2er.com/3121266.html

大家都在问