通常，使用auth0和Lock.js进行身份验证并不重要，但使用Next.js和SSR则比较棘手。我决定根据我发现的教程（nextjs-passport）尝试passport.js 。

我想将其部署到Firebase，所以我没有可用的Express服务器。Passport也应该与自定义回调一起使用，但是我只得到一个空白页，没有错误。

任何人还可以通过最新的Next.js实施Auth0身份验证吗？

/pages/login.js

import React from 'react'

export default () => (
  <form action='/api/login' method='post'>
    <div className='field'>
      <p className='control has-icons-left has-icons-right'>
        <input className='input' name='email' type='email' placeholder='Email' />
      </p>
    </div>
    <div className='field'>
      <p className='control has-icons-left'>
        <input className='input' name='password' type='password' placeholder='Password' />
      </p>
    </div>
    <div className='field'>
      <p className='control'>
        <input type='submit' className='button is-success' />
      </p>
    </div>
  </form>
)

/pages/api/login.js

import passport from 'passport'
import Cors from 'micro-cors'

const cors = Cors({
  allowedMethods: ['POST', 'HEAD']
})

function Login (req, res, next) {
  return passport.authenticate('auth0', {
    scope: 'openid email profile',
    successRedirect: '/',
    failureFlash: true,
    failureRedirect: '/login'
  }, function (err, user, info) {
    console.log(err, user, info)
    if (err) { return next(err) }
    if (!user) { return res.redirect('/login') }
    req.logIn(user, function (err) {
      if (err) { return next(err) }
      return res.redirect('/users/' + user.username)
    })
  })(req, res, next)
}

export default cors(Login)