koa jwt鉴权

最新推荐文章于 2022-12-10 10:02:43 发布

Jay_帅小伙

最新推荐文章于 2022-12-10 10:02:43 发布

阅读量123

点赞数

分类专栏： node.js 文章标签： jwt nodejs

本文链接：https://blog.csdn.net/qq_42975676/article/details/106813135

版权

node.js 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

<html>
  <head>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js">
    </script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  </head>
  <body>
    <div id="app">
      <div>
        <input v-model="username" />
        <input v-model="password" />
      </div>
      <div>
        <button v-on:click="login">Login</button>
      <button v-on:click="logout">Logout</button>
    <button v-on:click="getUser">GetUser</button>
 </div>
  <div>
    <button @click="logs=[]">Clear Log</button>
 </div >
 < !-- ⽇志-- >
  <ul>
    <li v-for="(log,idx) in logs" :key="idx">
 {{ log }}
 </li>
 </ul >
 </div >
  <script>
    axios.interceptors.request.use(
 config => {
 const token = window.localStorage.getItem("token");
 if (token) {
      // 判断是否存在token，如果存在的话，则每个http header都加上token
      // Bearer是JWT的认证头部信息
      
 config.headers.common["Authorization"] = "Bearer " +
token;
 }
 return config;
 },
 err => {
 return Promise.reject(err);
 }
 );
 axios.interceptors.response.use(
 response => {
      app.logs.push(JSON.stringify(response.data));
 return response;
 },
 err => {
      app.logs.push(JSON.stringify(response.data));
 return Promise.reject(err);
 }
 );
 var app = new Vue({
      el: "#app",
 data: {
      username: "test",
 password: "test",
 logs: []
 },
 methods: {
      login: async function() {
 const res = await axios.post("/users/login-token", {
      username: this.username,
 password: this.password
 });
 localStorage.setItem("token", res.data.token);
 },
 logout: async function() {
      localStorage.removeItem("token");
 },
 getUser: async function() {
      await axios.get("/users/getUser-token");
 }
 }
 });
 </script>
 </body >
</html >

const Koa = require('koa')
const router = require('koa-router')()
const jwt = require("jsonwebtoken")
const jwtAuth = require("koa-jwt")
const secret = "it's a secret"
const cors = require('koa2-cors')
const bodyParser = require('koa-bodyparser')
const static = require('koa-static')
const app = new Koa();
app.keys = ['some secret'];
app.use(static(__dirname + '/'));
app.use(bodyParser())
router.post("/users/login-token", async ctx => {
  const { body } = ctx.request;
  //登录逻辑，略
  //设置session
  const userinfo = body.username;
  ctx.body = {
    message: "登录成功",
    user: userinfo,
    // ⽣成 token 返回给客户端
    token: jwt.sign(
      {
        data: userinfo,
        // 设置 token 过期时间，⼀⼩时后，秒为单位
        exp: Math.floor(Date.now() / 1000) + 60 * 60
      },
      secret
    )
  };
});
router.get(
  "/users/getUser-token",
  jwtAuth({
    secret
  }),
  async ctx => {
    // 验证通过，state.user
    console.log(ctx.state.user);

    //获取session
    ctx.body = {
      message: "获取数据成功",
      userinfo: ctx.state.user.data
    };
  }
);
app.use(router.routes());
app.use(router.allowedMethods());
app.listen(3000);

Jay_帅小伙

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
koa jwt鉴权

<html> <head> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"> </script> <script src="https://unpkg.com/axios/dist/axios.min.js"></script> </head> <body> <div id="app">
复制链接

扫一扫