Using Create-React-App with Apache VirtualHost

Question

我正在为一家公司开发一个项目。这家公司有一个API，只允许来自两个来源的请求：他们自己的主机和xyz.localhost。

起初，我只使用jQuery开发了这个项目(通过CDN加载(。使用ApacheVirtualHost设置，这就起到了作用——我可以访问API。

现在，我想重构这个项目并使用React。我使用create-react-app创建了一个React目录。

问题是：我可以让create-react应用程序使用xyz.localhost，但我仍然在Chrome中收到CORS错误消息：

Access to fetch at 'http://api.thatcompany.com/search?search=a' 
from origin 'http://xyz.localhost:3000' has been blocked by CORS policy

有人知道如何让它发挥作用吗？提前谢谢。

---

/private/etc/apache2/httpd.conf:

# Virtual hosts
#Include /private/etc/apache2/extra/httpd-vhosts.conf
Include /private/etc/apache2/vhosts/*.conf

/私有/etc/hosts:

127.0.0.1       xyz.localhost
255.255.255.255 broadcasthost
::1             xyz.localhost

/private/etc/apache2/vhosts/xyz.localhost.conf：

<VirtualHost *:80>
DocumentRoot "/Users/MYUSERNAME/dev_projects/MY-REACT-APP/public"
ServerName xyz.localhost
<Directory "/Users/MYUSERNAME/dev_projects/MY-REACT-APP/public">
AllowOverride All
Require all granted
</Directory>
<filesMatch ".(html|htm|js|css)$">
FileETag None
<ifModule mod_headers.c>
Header unset ETag
Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT"
</ifModule>
</filesMatch>
</VirtualHost>

我的创建反应应用程序启动脚本：

"scripts": { "start": "HOST=xyz.localhost react-scripts start" }

Answer 1

我找到了一个解决方法。

我只是简单地将VirtualHost指向Create React应用程序的构建文件夹，这起到了作用，并为我提供了静态文件。

编辑代码非常令人厌烦，因为每次更新后我都必须运行npm run Build。

幸运的是，我找到了npm watch模块。这样，create-reflect应用程序将在每次保存时重新生成。在保存和刷新浏览器之间，我还需要等待一秒钟，它绝对不能单独使用create-react应用程序，但这是一个足够好的解决方案！