angularjs - AngularJs 中的 VueJs - 如何阻止 AngularJs 拦截特定于 VueJs 的路由

Question

我维护了一个（遗留）大型电子商务网络应用程序（使用 AngularJS 构建），并且我正在使用 VueJs 从头开始​​重建它。

不幸的是，这两个应用程序必须共存（直到所有现有功能都在 VueJs 中重写），这意味着当我在 VueJs 上重建功能时，我们将用户迁移到新组件（或页面或功能）而不是旧组件。

这样做没有问题，我可以设置配置文件等来设置从组件到组件的路由。

然而，问题在于 VueJS 应用程序必须存在于 AngularJs 应用程序中。这是由于许多因素，其中之一是 SEO（没有使用子域的选项）、复杂的部署等等。

我已经完成了让 VueJs 应用程序存在于 AngularJs 应用程序中所需做的事情，并且除了一个特定的路由问题之外，几乎一切正常。

build这是我的命令运行后的一个非常粗略的结构：

• /dist <---- AngularJs 应用程序根目录
  • 索引.html
  • /应用程序
    • 应用程序.js
    • 应用程序.css
  • /vue <---- VueJs 应用程序根目录
    • 索引.html
    • ...ETC

当用户登陆时site.com/vue，vue 接管，并且 internal<router-link>的工作正常。

问题是当用户在地址栏中专门键入类似这样的内容时site.com/vue/page-1。AngularJs 拦截了它，基本上称之为 404。

我尝试通过创建一个具有特定 url 的 UI 路由器状态来解决这个问题，该状态/vue/:page与我的 VueJs 应用程序位置的文件夹匹配。但这并没有真正做好它的工作。

我还尝试在 ui-router 上收听路由更改$stateChangeStart，但这很快就会变得昂贵。

谁能想到解决这个问题的方法？我知道非常奇怪的情况，但不幸的是，我对整体架构的方式没有太多选择。

标签： angularjsvue.jsangular-ui-router

Answer 1

用户输入 url 后 - 浏览器发送新的 http 请求，返回什么由您的服务器决定。（这通常与 js 或 UI 无关）我猜您的服务器会为未找到的路由返回 angular index.html，您可以轻松更改它。