我使用静态构建包将 React 应用程序部署到 Cloud Foundry。目标是使应用程序可以在domain.com/下访问path。所以我根据他的博客文章配置了路线:https://www.cloudfoundry.org/context-path-routing/ https://www.cloudfoundry.org/context-path-routing/
另外,我设置了pushstate: enabled
在静态文件中并将上下文路径添加到静态资产 URLS 中;例如。样式表的 URL 是domain.com/path/static/style.css
。
当我访问domain.com/path 时,我得到了index.html 文件。但是,找不到 index.html 文件中链接的静态资源,而是找到了索引文件。如果在服务器上找不到资源,这是推送状态路由的默认行为。
我还需要配置什么才能运行该应用程序吗pushstate: enabled
在“子目录”中?
当您启用推送状态时pushstate: enabled
,由 buildpack 为您的应用程序组装的 Nginx 配置将大致如下所示。我还突出显示了专门为解决推送状态而添加的部分。
server {
listen 8080;
server_name localhost;
root /home/vcap/app/public;
location / {
# <-- this bit here is what's added for push state support
if (!-e $request_filename) {
rewrite ^(.*)$ / break;
}
# -->
index index.html index.htm Default.htm;
}
}
您可以在构建包中看到启用此功能的代码here https://github.com/cloudfoundry/staticfile-buildpack/blob/5a588b6e3d3673521a4cc13faf4d34ab67300713/src/staticfile/finalize/data.go#L96-L100.
我认为简短的答案是,buildpack 假设您用完了根目录而不是子目录,这就是当您使用 Cloud Foundry 的基于路径的路由时会发生的情况。
要解决此问题,您只需手动启用相同或相似的 Nginx 配置即可。为此,我建议采取以下措施:
-
Enable 自定义位置配置 https://docs.cloudfoundry.org/buildpacks/staticfile/index.html#config-options。请参阅该链接中具有该名称的表中的列并按照这些说明进行操作。这给了我以下内容Staticfile
.
root: public
location_include: includes/*.conf
请注意,这要求所有静态文件都位于名为的文件夹下public
(或者您想要命名的文件根文件夹的任何名称)。使用时必须这样做location_include
.
-
添加自定义包含文件nginx/conf/includes/push_state.conf
并在文件内添加以下内容。
location /path/ {
if (!-e $request_filename) {
rewrite ^(.*)$ /path/ break;
}
index index.html index.htm Default.htm;
}
推送您的应用程序。它应该使用添加到构建包使用的基本 Nginx 配置中的自定义代码进行部署和运行。
希望有帮助!
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)