使用 Strip Connect 的重定向链接处理 Vue 中的路由

Question

流程：后端向 Vue 发送 o-auth 链接，用户单击指向 stripe 表单的链接，完成表单后，它会将用户引导至我指定的 URL。

我有一个 vue 客户端应用程序，我想使用 stripe 连接。从我的后端应用程序中，我发送一个 [o-auth 链接][1]，用户可以在其中填写他们的 Stripe 信息，完成后，它会将我重定向到我在 Stripe 设置中指定的 URL（http:// localhost:8080/test 并且这在测试模式下有效）。

我面临的问题是，即使链接正确，vue 也不会重定向到

test

页面并停留在当前页面。当我通过模板中的

test

重定向页面时，

<router-view></router-view>

页面会呈现。我的路由器确实配置正确，所以我不知道为什么它不转到重定向链接并呈现该页面。

我的路由器设置：

  routes: [
    {
      path: '/',
      name: 'mainContent',
      component: MainContent
    },
   {
      path: '/test',
      name: 'test',
      component: test
    },
    {
      path: '/manage',
      name: 'manage',
      component: Manage,
      meta: {
        requiresAuth: true,
      }
    },
  ]
})


  [1]: https://stripe.com/docs/connect/express-accounts

Answer 1

这混淆了几个问题。正如其他人指出的那样，Stripe 并不是这里的罪魁祸首，尽管它造成了 VueJS 和 Vue Router 特有的情况。正如 HTML5 历史模式下的 Vue Router 文档中所述 在此处输入链接描述 此问题需要更改 VueRouter 配置，可能需要更改 Web 服务器（例如 httpd 、 nginx 等）和页面脚本。

但是，这里出现了一个问题：由于我们的应用程序是单页客户端应用程序，没有正确的服务器配置，如果用户直接访问 http://oursite.com/user/id ，将会收到 404 错误他们的浏览器。现在很难看。

根本原因是 VueRouter 没有为 URL 创建实际的端点文件，而这正是 Web 服务器所需要的。相反，VueRouter 会生成它处理的模拟 URL。这既令人困惑又相互矛盾“这很容易：实际上既不简单也不可行的例子。

我最近解决了 Stripe 的一个更大问题，即从付款到我的 VueJS SPA 进行重定向响应，并弄清楚如何将其返回到有状态存储的数据对象和路由架构中，以继续应用程序的安全数据/操作处理。需要进行大量的试验和错误并监视调试级别服务器日志。