javascript - 由于 Vagrant 设置中的不同端口导致的跨域 ajax 错误

Question

我正在使用此设置开发 Web 应用程序:

Production:
  frontend.myapp.com
  appserver.myapp.com
  auth.myapp.com

Development:
  localhost:8080 (frontend)
  localhost.com:3010 (appserver)
  localhost.com:3011 (auth)

Frontend 是一个与 nginx 一起提供的 angularjs SPA。 Appserver 是一个公开 api(用户、项目、订单...)的 Rails 应用程序。 Auth 是另一个使用 omniauth 处理身份验证的 Rails 应用程序。

在生产中，我们使用不同的子域作为虚拟主机。在开发中，我们使用不同的端口(因为在 vagrant 中更容易配置)。

一切正常，除了一件事:angular 应用程序(前端)有时需要向 auth 服务器发出 ajax 请求，这被认为是跨域攻击，因为前端端口是 8080 而 auth 端口是3011，生产中不存在这个问题，因为我们使用的是子域。

如何防止跨域错误？

---

一个解决方法是在开发中也使用子域。 (例如，在我的主机文件中:

10.2.0.15 frontend-local.myapp.com
10.2.0.15 appserver-local.myapp.com
10.2.0.15 auth-local.myapp.com

(10.2.0.15 是我的 Vagrant 机器 ip)

我喜欢这个修复，因为我的本地设置更像是生产设置(使用子域而不是端口)。

但是在 vagrant 重新加载后，我的访客 (lucid32) 机器的 ip 会改变，我需要再次编辑我的主机文件......

而且我还没有找到告诉 vagrant 分配静态 IP 的方法...

有什么建议吗？

Answer 1

访问不同的端口违反了Same Origin Policy ，这就是它不起作用的原因。您可以使用 JSONp 请求，但在生产中不需要它们。如果你设置 Access-Control-Allow-Origin 怎么样？允许本地计算机上的每个域？那么它至少应该可以在现代浏览器中运行。