获取跨源读取阻止 (CORB) 在服务 ReactJS 应用程序时阻止了 MIME 类型 text/html 的跨源响应

Getting Cross-Origin Read Blocking (CORB) blocked cross-origin response with MIME type text/html when serving ReactJS app

我有一个 Wordpress 测试站点,可以反向代理到 reactjs 应用程序。但是,提供了一个空白页面,我在控制台上看到 Cross-Origin Read Blocking (CORB) blocked cross-origin response with MIME type text/html

当我在 public/index.html 中添加普通 "Hello, World!" 时,会显示 Hello World,但不会显示页面的其余部分。

编辑: 为了进一步解释,我的 wordpress 站点有一个服务于 reactjs 应用程序的子文件夹。

我的 reactjs 应用是:http://dspstaging.drwealth.com 我的测试 wordpress 网站是:http://35.240.238.94 我的服务于 reactjs 应用程序的 url 是:http://35.240.238.94/datastaging

如您所见,http://dspstaging.drwealth.com 运行良好,但是,当我尝试通过 http://35.240.238.94/datastaging 访问时,仅显示 "Hello World",并且控制台显示 CORB 警告。

想通了。由于反向代理,浏览器在 Wordpress 站点的服务器而不是 React 应用程序服务器中寻找 ReactJS 应用程序的静态文件夹。我收到 CORB 警告,因为它没有收到它期望的 CSS 文件。

为了解决这个问题,我必须创建另一个重写规则,这次是针对文件夹 /static 的请求。我的 .htaccess 文件现在看起来像这样:

RewriteEngine On
RewriteRule ^datastaging(.*) http://35.198.238.40/data/ [P]
RewriteEngine Off

# Rewrite rule for static folder
RewriteEngine On
RewriteRule ^static(.*) http://35.198.238.40/static/ [P]
RewriteEngine Off

希望这对某人有所帮助。