个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我在我的开发和生产环境中使用 S3 静态网站托管 React 应用程序，效果非常好。我使用 dev-myapp-mycompany 和 prod-myapp-mycompany 等存储桶命名方案，并为每个环境都有一个专用存储桶。
我的团队不断创建需要测试的功能分支，虽然我可以为每个新分支创建一个新存储桶，但我们必须在几个冲刺内要求增加存储桶，然后经常修剪它们。
我想做的是在根目录有一个简单的 index.html 存储桶 feature-myapp-mycompany ，它将提供每个存储桶的链接应用程序当前部署到此功能存储桶中。类似的东西
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Feature Bucket</title>
</head>
<body>
<h1>Feature Branches</h1>
<ul>
<li>
<a href="./feature1/index.html">Feature 1</a>
</li>
<li>
<a href="./feature2/index.html">Feature 2</a>
</li>
...
<li>
<a href="./featuren/index.html">Feature n</a>
</li>
</ul>
</body>
</html>
为此，存储桶结构如下所示
index.html
/feature1
index.html
/static
/feature2
index.html
/static
/featuren
index.html
/static
我通过 AWS cli 部署所有应用程序，因此编写脚本并不是一个挑战。我用类似的东西
npm run buildaws s3 同步 ./build s3://%bucket%/%feature% --delete --profile=%profile% --region=us-east-1将代码放入存储桶中没有问题。这是我陷入困境的地方:
我的问题:我已按上述方式部署了代码，但 create-react-app 项目从域的根定义了其静态依赖项。因此，feature1 的 index.html 具有类似 /static/css/main.9fac6334.chunk.css 的 href。该请求会查看我的存储桶的根目录，其中只有主要的 index.html 和每个功能的“目录”。我在主 index.html 上的链接确实将我带到了正确的应用程序 index.html 但没有任何脚本或 css 引用有效，因为它们基于根.
尝试的解决方案:create-react-app 允许您在 package.json 中指定一个 homepage 选项，用于在应用程序中设置 baseURL。我似乎需要的是相对路径，而不是绝对路径，所以我尝试将主页的值设置为 "./" 然后 http://feature-myapp-mycompany.s3 -website-us-east-1.amazonaws.com/feature1。在这两种情况下，链接都会暂时将我带到正确的位置，然后将我重定向回根目录下的主 index.html 文件。我知道这很有用，因为在它重定向我之前，我瞬间看到了网站的样式和主题。我什至看到 Chrome 的网络选项卡中发生了正确的请求，但在尝试所有请求后，我看到它重定向回根目录的主索引文档。
尝试的解决方案(续):S3 静态托管允许重定向规则。我尝试了各种重定向选项，最终使我陷入同一资源的无限循环，从而导致请求失败。我的配置是这样的
<RoutingRules>
<RoutingRule>
<Condition>
<KeyPrefixEquals>feature1/</KeyPrefixEquals>
</Condition>
<Redirect>
<ReplaceKeyPrefixWith>feature1/</ReplaceKeyPrefixWith>
</Redirect>
</RoutingRule>
</RoutingRules>
当然，这不起作用，因为它将前缀重写回相同的值。在没有我尝试的解决方案的情况下执行相同类型的重定向规则也不起作用，因为请求不会发送到具有前缀 feature1/ 的资源，而是发送到根目录。
我理想的解决方案:我希望将 package.json 中的 homepage 选项和一些重定向规则结合起来，以将对每个应用内的静态资源的请求重定向回根目录他们各自的功能分支目录。例如，对 /static/css/main.9fac6334.chunk.css 的请求应该查看 feature1 目录，而不是根目录。
我并不害怕为我们将拥有的许多分支编写脚本，但我似乎无法为单个示例子应用程序提供正确的选项。
提前感谢您提供的帮助，祝您在自己的编码冒险中好运。
最佳答案
我能够使用this SO post完成我需要做的事情。我们已经在其他环境中使用了 Cloudfront 发行版，而且设置起来非常容易。
以下是我们在此学到的内容的摘要:
使用如下设置为指向您存储桶的每个应用创建一个 Cloudfront 发行版
a.将feature1放入bucket目录/前缀 feature1/
b.使用原始路径 /feature1 和默认根对象 index.html
c.干净利落地离开
关于reactjs - 使用一个 S3 存储桶托管多个 React 应用程序，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55931904/
25
4
0
我会尝试尽可能详细地描述我的问题，但如果需要更详细的解释，请告诉我。 为了简化，假设我有 3 个 DLL(实际上我有更多，但我猜这不是很重要): managed-1.dll - 托管 DLL(用 C#
我有一个 Tomcat 6 JSF Web 应用程序，我想使用 CDI bean 来设置它。不过，我必须逐渐将项目转换为 CDI。 我的问题是:CDI bean 和传统的 JSF 托管 bean 可以
我计划将 Web 应用程序从使用 JSF 托管 Bean 转换为使用 CDI 托管 Bean。我知道我需要执行以下操作: 在 WEB-INF 中添加一个空 beans.xml 文件。 将所有 JSF
我在裸域上运行我的解析应用程序。 Parse 并没有让我的生活变得轻松。 起初我很难设置它，因为大多数 DNS 托管服务不允许根域上的 CNAME，而 Parse 需要 CNAME。 决定尝试使用 C
如果您使用 Firebase 托管 将请求定向到 云函数 通过重写，“通过”托管的请求流量是否会记入 Firebase 托管 国标转出 ? (忽略 Cloud Function 的计费) 换句话说，
关闭。这个问题是off-topic .它目前不接受答案。 想改善这个问题吗？ Update the question所以它是 on-topic对于堆栈溢出。 9年前关闭。 Improve this q
我有一个特定的用例，我正尝试使用 Firebase 托管来解决，它如下: 我正在使用 Gridsome 生成静态网站 在构建之前，Gridsome 使用 Graphql 并从 Headless CMS
您好，我有一个blazor页面，我想在其中显示一个变量。 这个变量从另一个线程(通过Websocket接收数据的另一个线程)获取更新，我想以线程安全的方式显示它: Blazor页面 @page "/n
我想使用 Firebase 托管来托管一个 angular 应用程序，我需要创建一个重定向到另一个 URL 中的一些旧文件。 根据 Firebase 文档，您可以进行基本重定向 "redirects"
我正在尝试找出满足电子学习平台以下要求的最佳方法。 我在其中编辑视频的后端，以便可以将它们彼此链接(例如youtube-comment函数) 用户只能在访问平台时观看视频(不允许下载!) 视频只能通过
已关闭。这个问题是 not about programming or software development 。目前不接受答案。 这个问题似乎不是关于 a specific programming
我想这是一个相当深入的主题，因此任何带有洞察信息的网址也很乐意接受。我一直在使用原生 DirectX，但从未管理过。另一方面，大多数情况下，在开发不需要高级 GPU 渲染的其他类型的应用程序时，我通常
我刚刚将一个网站部署到 Firebase 托管，效果非常好 - 设置非常简单。 但是，我的问题是，有什么方法可以使访问该网站受到身份验证的限制吗？这是一个管理面板，只有我的团队才能访问。有什么方法可以
已关闭。这个问题是 not about programming or software development 。目前不接受答案。 这个问题似乎不是关于 a specific programming
就目前情况而言，这个问题不太适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持，但这个问题可能会引发辩论、争论、民意调查或扩展讨论。如果您觉得这个问题可以改进并可能重新开放，visit
按照目前的情况，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 要求我们推荐或查找书籍、工具、软件库、教程或其他场外资源的问题对于 Stack Overflow 来说是
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题，以便用事实和引用来回答。 关闭 6 年前。
我刚刚将一个网站部署到 Firebase 托管，它运行良好 - 设置非常简单。 但是，我的问题是，有什么方法可以通过身份验证限制对网站的访问？这是一个只有我的团队才能访问的管理面板。有什么方法可以用密
如果我想托管一个对公众用处不大的应用程序(例如，一个将点打印到控制台的程序，它们的数量取决于现在的时间)，我喜欢在启动板中的方式不必乱扔全局托管站点的命名空间并用诸如 HourDot 之类的名称填充它
我是一名优秀的程序员,十分优秀！