Question

您好我正在使用Auth0与Nodejs和angularjs

这是我想要实现的目标 1.我想用户使用auth0的锁定进行注册 2.只要用户登录回调，就应该在我的nodejs服务器上调用 3.之后我将获得用户信息和用户的JWT
4.然后我将用户重定向到仪表板页面并将JWT存储在浏览器中

Auth0的例子有什么问题
1.他们提供的例子是单独的角度或独立的节点，而不是组合的 2.有组合（客户端服务器）示例但是使用带有nodejs的玉

我的代码已剪断

Angular snipped

    var options = { auth: {
          redirectUrl: 'http://localhost:3000/callback'
        , responseType: 'code'
        , params: {
          scope: 'openid name email picture'
        }
  }
}

    lockProvider.init({
      clientID: 'cUlBNhhaIblahBlahRp6Km',
      domain: 'rishabh.auth0.com',
     option:options
    });

节点已剪切

router.get('/callback',
  passport.authenticate('auth0', { failureRedirect: '/url-if-something-fails' }),
  function(req, res) {
    console.log(req.user);
    res.json({id_token:req.user});
  });

注意：我在auth0中添加了这个回调 http://localhost:3000/callback 但是当我在角度方面提到我的重定向网址时，不知道为什么我面临回调错误的错误

任何人都可以告诉我我的代码有什么问题，为什么auth0没有将我重定向到这个网址http://localhost:3000/callback

而有趣的是当我使用简单的lock.js而不是像这样的角度

<script>
var options = { auth: {
          redirectUrl: 'http://localhost:3000/callback'
        , responseType: 'code'
        , params: {
          scope: 'openid name email picture'
        }
  }
}

var lock = new Auth0Lock('clientID', 'rishabh.auth0.com',options);
lock.show();
</script>

然后在这种情况下我的nodejs / callback路由被正确调用，所以我用angular做错了什么？

请帮助

更新这是我的项目结构

完整代码 https://github.com/LabN36/error

Config.js

    var Auth0Strategy = require('passport-auth0');
var passport = require('passport');


var strategy = new Auth0Strategy({
    domain:       process.env.AUTH0_DOMAIN || 'rishabh.auth0.com',
    clientID:     process.env.AUTH0_CLIENT_ID || 'cUheWwRxm7OLdHBRzlBNvfvfvfvfvhhaI1lxRp6Km',
    clientSecret: process.env.AUTH0_CLIENT_SECRET || 'e37eIZpjgBnDMBtrYMwvffvfvfvfaU4jSqt8qylZMT9Oj1EiffLGViinWQ5AiuWi1-WBwA8v3',
    callbackURL:  process.env.AUTH0_CALLBACK_URL || 'http://localhost:3000/callback'
  }, function(accessToken, refreshToken, extraParams, profile, done) {
    // accessToken is the token to call Auth0 API (not needed in the most cases)
    // extraParams.id_token has the JSON Web Token
    // profile has all the information from the user
     console.log(extraParams.id_token);
     //save user detail with token here and return token only profile
    return done(null, extraParams.id_token);
  });

passport.use(strategy);

// you can use this section to keep a smaller payload
passport.serializeUser(function(user, done) {
  done(null, user);
});

passport.deserializeUser(function(user, done) {
  done(null, user);
});

module.exports = passport;

AngularApp.js

    angular.module('workApp',['auth0.lock'])

.config(function($locationProvider,lockProvider){

var options = { auth: {
          // redirect:true,
         responseType: 'code',
          redirectUrl: 'http://localhost:3000/callback',
         params: {
          scope: 'openid name email picture'
        }
  }
}

    lockProvider.init({clientID: 'cUheWwRxm7OLdHBRzlBNhhaI1lxRp6Km',domain: 'rishabh.auth0.com',
    option:options
});
$locationProvider.html5Mode(true);
})
.controller('homeCtrl',function($scope,$http,$location,$window,lock){

  $scope.login = function() {
    // window.alert("magic")
    console.log("Messed Up really")
    var vm = this;
  vm.lock = lock; 
  lock.show();
  }

}).run(function(lock){
    lock.interceptHash();

  lock.on('authenticated', function(authResult) {
    localStorage.setItem('id_token', authResult.idToken);

    lock.getProfile(authResult.idToken, function(error, profile) {
      if (error) {
        console.log(error);
      }
      localStorage.setItem('profile', JSON.stringify(profile));
    });
  });
})

Answer 1

根据屏幕截图，错误发生是因为身份验证请求是使用redirect_uri：

进行的

http://localhost:3000/

，允许的回调网址为：

http://localhost:3000/的回调
http://35.162.118.253:3000/ 回调

同样基于您分享的代码，您确实将redirectUrl设置为http://localhost:3000/callback，因此代码的其余部分可能会出现导致该值被覆盖或未使用的内容一点都不。

如果未设置redirectUrl，则Lock将使用当前页面，因此可能的罪魁祸首是您设置的选项未被使用。如果仍然找不到原因，请使用与Lock显示方式相关的代码更新问题。

该死的，实际的根本原因已经显示在您最初提供的代码中，但现在仅查看完整代码使我能够抓住它...

您正在使用：
致电lockProvider.init()
{ clientID: [?], domain: [?], option: options }

应该使用：
进行调用
{ clientID: [?], domain: [?], options: options } // options instead of option

使用auth0进行角度回调失配错误

1 个答案: