ローリングセッション認証を備えたnode.js(エクスプレス、パスポート)アプリケーションがあります。
アプリケーションは非常にシンプルで、セッションのCookieを返すlogin-passwordと、認証でのみ使用できるいくつかのAPI関数があります。
そのアプリケーションのフロントエンドとしてVue.jsを使用したいのですが、Vueでそのような認証を実装する方法に関する信頼できるドキュメントやガイドを見つけることができません。JWTに重点が置かれているようです。Vueで行うことさえ可能ですか?
Axiosを使用して認証関数を呼び出すだけで試しました
<script>
import router from "../router"
import axios from "axios"
export default {
name: "Login",
methods: {
login: (e) => {
e.preventDefault()
let email = "[email protected]"
let password = "password"
let login = () => {
let data = {
email: email,
password: password
}
axios.post("/srv/login", data)
.then((response) => {
router.push("/loginpage")
})
.catch((errors) => {
console.log("Failed to log in")
})
}
login()
}
}
}
</script>
これはログインに関しては機能しますが、このAPIを呼び出した後にセッションを保存するにはどうすればよいですか?返されたCookieを処理し、最も重要なこととして、アプリ自体の状態を認証済みにする方法を教えてください。
フロントエンド部分(Vue)では何もする必要はありません-すべてがバックエンドによって行われます。
JWTの場合とほぼ同じように実行しますが、本文の一部としてトークンを返す代わりに、トークンをCookieに入れます。
const SECRET_KEY = '123456789'
const expiresIn = '30min'
// Create a token from a payload
function createToken(payload)
{
return jwt.sign(payload, SECRET_KEY, { expiresIn })
}
app.post('/login', (req, res, next) =>
{
const { username, password } = req.body
const userID = isAuthenticated({ username, password });
if (userID === 0)
{
const status = 401
const message = 'Incorrect username or password'
res.status(status).json({ status, message })
return
}
const accessToken = createToken({ id: userID })
res.cookie('sessionCookieName', accessToken, {httpOnly: true})
res.status(200).json({ success: true })
};
次に、他の各APIエンドポイントは、Cookieからのトークンを検証する必要があります。
// Verify the token
function verifyToken(token)
{
return jwt.verify(token, SECRET_KEY)
}
app.get('/getArticle', (req, res, next) =>
{
var cookie = req.cookies.sessionCookieName;
try
{
verifyToken(cookie)
next()
}
catch (err)
{
const status = 401
const message = 'Unauthorized'
res.status(status).json({ status, message })
}
});
次の記事も読むことができます。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加