Question

我正在尝试在同一服务器上设置多个React应用程序。问题是，在我构建项目之后，发现了index.html中的build/，但是找不到build/static中的辅助文件。最初，只有一个应用程序，我有location static/和别名。但是，对于多个项目和多个static/目录，我无法做到这一点。基本上，我希望每个应用程序都有自己的静态文件夹。我该如何解决我的问题？

在浏览器中，错误如下所示：

GET http://my.servername/static/css/2.266e55a5.chunk.css net::ERR_ABORTED 404 (Not Found)

我当前的设置是这样的：

server {
    listen   80;
    server_name my.servername;
    root   /data/adpop/;


    location /possible-malware-domains-viewer/ {
            alias /data/adpop/possible-malware-domains-viewer/build/;
            try_files $uri /possible-malware-domains-viewer/index.html;

            add_header Access-Control-Allow-Origin *;
            autoindex on;

            # Simple requests
            if ($request_method ~* "(GET|POST)") {
                    add_header "Access-Control-Allow-Origin"  *;
            }

            # Preflighted requests
            if ($request_method = OPTIONS ) {
                    add_header "Access-Control-Allow-Origin"  *;
                    add_header "Access-Control-Allow-Methods" "GET, POST, OPTIONS, HEAD";
                    add_header "Access-Control-Allow-Headers" "Authorization, Origin, X-Requested-With, Content-Type, Accept";
                    return 200;
           }
    }

    location /punycode-domains-viewer/ {
            alias /data/adpop/punycode-domains-viewer/build/;
            try_files $uri /punycode-domains-viewer/index.html;

            [...same settings as above...]
           }
    }
}

我尝试合并来自here，here或here的答案，如果看起来比较混乱或我有重大错误，请对不起。如果我要达到的目标不是很好，请提出其他建议。谢谢！

Answer 1

在多个项目和目录中共享相同的URI名称空间前缀不是十分有效或可扩展。最好为每个项目提供唯一的URI前缀，因此CREATE PROCEDURE [JDE].[GetPNAveragesTEST] ( @STR_PN NVARCHAR(MAX) ) AS BEGIN SELECT TT.ReturnedCol ,IsNull(Cast(pnm.AVERAGE_COST As nvarchar(35)), 'DNE') as AVERAGE_COST FROM dbo.fn_Get_MAXDelimStringToTable(@STR_PN) TT Left Join PN_Interchangeable pni ON TT.ReturnedCol=pni.PN_Interchangeable Left Join PN_MASTER pnm On pni.MPN=pnm.MPN END;使用类似/project1/index.html的URI来定位其资源。或者，对资源文件使用公用的构建目录，然后将它们收集在构建脚本中。

但是，如果必须将资源文件保存在单独的目录中，并使用相同的URI前缀来引用它们，则Nginx /project1/foo.css伪指令可以顺序搜索目录，直到找到匹配的文件名为止。

例如：

try_files

将首先在root /data/adpop; location /static/ { try_files /possible-malware-domains-viewer$uri /punycode-domains-viewer$uri =404; }处搜索URI /static/css/foo.css，然后在/data/adpop/possible-malware-domains-viewer/static/css/foo.css处搜索。如果找不到任何文件，则返回404状态。

有关详细信息，请参见this document。

Nginx：在同一服务器上服务多个React应用程序

1 个答案: