Question

我有一个带有节点（快速）后端和vue客户端的应用程序。我正在尝试使用护照添加SAML SSO。（在服务器节点应用上执行此操作很有意义）。

在Express应用程序中使用时效果很好。但是当我将其应用于快速后端和Vue客户端的结构时，它无法重定向到IDP。

当用户进入我的登录页面时，vue客户端（Login.vue）会调用节点后端以验证用户。（api验证用户）

节点调用password.authenticate（'saml'，...），我希望可以将响应发送回调用我的vue函数，然后在Login.vue中进行重定向。

但是问题来了：在后端节点应用程序中，在我的代码执行后，在通行证策略中发送了重定向响应。因此它会自动发送到浏览器，而不返回调用此节点api的vue脚本。

因此重定向是在后台完成的，用户看不到任何重定向。原始的登录页面仍然显示。我的vue函数仅从浏览器将重定向发送到后台（在后台）到IDP之后，才从API获取响应，并从IDP获取登录html页面响应。因此，我得到的数据-是IDP登录页面的html，而不是重定向数据。

我该如何解决？

我是客户端技术以及js和node的新手，所以我真的不知道应该如何处理这样的流程。寻找3天的解决方案。

非常感谢您的帮助！

这是我的代码段：

Login.vue：

<input class="button wide cropBottom io-mango ae-5 margin-top-0 toRight" v-on:click="userLogin"  type="button" value="Log In"/>
...
userLogin: function() {
      ...
      ...
        $(".overlay").show();
        this.$http.post(process.env.BASE_URL + "verifyuser", oUser)  //call backend node express app
         .then(function(data) {
               ...
               here I gets only an html login page which the IDP sent as a response to the redirect with the SAML Request.
          }

后端节点Express应用：

verifyuser.js：

module.exports = function (app) {
  app.post('/verifyuser', (req, res, next) => {


      var SamlStrategy = passportSaml.Strategy;

      passport.use(new SamlStrategy(
        {  ...
        });

      passport.authenticate('saml', {session: false}, function (err, user, info) {
            ...
            })(req,res,next);


    //tried to get the redirect here, but res still don't have it. only after this function is called, the SAML request is created from the req, and the location url is made.      

     });

Answer 1

我找到了解决方案。我更改了Vue客户端：而不是使用ajax调用服务器，并期望返回数据响应，我使用表格的帖子给服务器打电话。这样，当我调用浏览器时，浏览器就会重定向到服务器，并且当服务器中的通行证库返回重定向响应时-它是在前台完成的，用户可以看到它。

在“单次登出”中，护照做得更好：护照API仅返回创建的注销请求。那么我可以自行决定是否要从服务器重定向，还是要将重定向请求发送到正在等待的客户端功能-并从那里进行重定向。

如何将护照SAML与节点（快速）作为后端，将vue作为客户端一起使用

1 个答案: