如何在Amazon Cloudfront中的React App中提供静态博客

Question

我有一个React网站和一个jekyll博客。我希望在mannger之后将它们托管在Amazon cloud-front中。

example.com->服务于React网站 example.com/blog->提供静态博客的index.html

我已经构建了react应用并将其放入s3存储桶中。然后，我创建了一个名为blog的子目录，并将所有博客内容上载到那里。然后，我为mydomain.com设置了一个面向云的发行版

如果我访问example.com，它将为React网站提供服务。 如果我通过直接在浏览器中输入网址来访问example.com/blog，则在某些浏览器中也可以正常运行。 但是，如果我单击react网站上的定位链接，该链接链接到mysite.com/blog而不是重新添加博客，则它会在同一页面中显示混乱的CSS和资产。好像react应用程序重写了请求并呈现了react页面，而不是将请求发送到后端。

我不使用react-router。这是我在react应用中用于链接博客的锚点

<a className="ml-nav-item" 
   href="http://example.com/blog/index.html" 
   rel="noopener noreferrer" 
   target="_blank">
  Blog
</a>