【问题标题】:Passport local returns error 400 bad request with AngularPassport local 使用 Angular 返回错误 400 错误请求
【发布时间】:2016-04-15 07:53:58
【问题描述】:

我正在尝试将护照集成到我的代码登录表单中。客户端调用服务器端正常工作,直到我在请求中调用 passport.authenticate,返回 400 Bad Request。我在这里错过了什么。

HTML

        <div>
            <div class="row">
                <div class="input-field col s12">
                    <input id="user-email" type="text" ng-model="user.email">
                    <label for="user-email">Your email address</label>
                </div>
            </div>
            <div class="row">
                <div class="input-field col s12">
                    <input id="user-password" type="password" ng-model="user.password">
                    <label for="user-password">Your password</label>
                </div>
            </div>
            <div id="login-button-panel" class="center-align">
                <button class="btn" id="login-btn" ng-click="vm.login(user);">Login</button> 
            </div>
            <div class="section center">
                <a class="modal-trigger">Forgot password?</a>
            </div>
        </div>

JS

$http.post('/api/login',user).success(function(result){
    console.log(result)
})

server.js

passport.use(new LocalStrategy(
    function(username, password, done) {
        return done(null, false, {message:'Unable to login'})
    }
));
passport.serializeUser(function(user,done){
    done(null,user);
});

passport.deserializeUser(function(user,done){
    done(null,user);
});
app.post('/api/login', passport.authenticate('local'), function(req,res){
    res.json(req.user)
});

【问题讨论】:

    标签: javascript angularjs express passport.js passport-local


    【解决方案1】:

    这个错误也来自于尝试访问请求负载而不使用 body-parser

    使用-

    var parser = require('body-parser');
    var urlencodedParser = parser.urlencoded({extended : false});
    
    
        app.post("/authenticate", urlencodedParser, passport.authenticate('local'), function (request, response)
        {           
            response.redirect('/');                      
        });
    

    【讨论】:

      【解决方案2】:
      passport.use(new LocalStrategy(
          {
              usernameField: 'email',
              passwordField: 'password'
          },
          function (email, password, done) {
              db.collection('User').findOne({ email: email }, async function (err, user) {
                  console.log('user requested password caught in passport', password);
                  if (err) { return done(err); }
                  if (!user) { return done(null, false); }
                  const matchPassword = await comparePassword(password, user.password);
                  if (!matchPassword) { return done(null, false); }
                  return done(null, user);
              });
          }
      ));
      

      【讨论】:

      • 尝试更清楚地解释为什么这是问题的答案。
      • 默认情况下,LocalStrategy 在对请求进行身份验证时采用用户名和密码,但我们需要的是电子邮件和密码。为此,我们需要 { usernameField: 'email', passwordField: 'password' }跨度>
      【解决方案3】:

      就我而言(Express 4.0),我没有使用body-parser

      【讨论】:

      • 同样,我在 /login 之后设置了 app.use(express.json()); json 正文解析器
      【解决方案4】:

      Bad Request 因缺少对用户名和密码的访问权限而被护照抛出。

      它正在检查字段 usernamepassword 的正文和 URL 查询。如果其中一个是 falsy,则请求被拒绝,状态为 400。

      在创建 LocalStrategy 时,您可以将附加参数中的一组选项传递给构造函数,使用选项 usernameField 和/或 passwordField 选择不同命名的字段。在您的特定情况下,这看起来像这样:

      passport.use(new LocalStrategy(
          {usernameField:"user-email", passwordField:"user-password"},
          function(username, password, done) {
              return done(null, false, {message:'Unable to login'})
          }
      ));
      

      【讨论】:

      • 抱歉回复晚了。是的,你是对的。谢谢!
      • options 对象应该是 LocalStrategy 构造函数中的第一个参数,而不是 passport.use 方法中的第二个参数。
      • @Fkids 感谢您的建议。修好了。
      • 巨大的帮助!谢谢楼主
      猜你喜欢
      • 2021-08-15
      • 1970-01-01
      • 2017-03-29
      • 1970-01-01
      • 2019-07-28
      • 1970-01-01
      • 2018-04-07
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多