koa 基础(十四)cookie 的基本使用

1.app.js

/**
 * cookie的简介:
 * 1、cookie保存在浏览器客户端
 * 2、可以让我们用同一个浏览器访问同一个域名的时候共享数据
 * 
 * cookie的作用:
 * 1、保存用户信息
 * 2、浏览器历史记录
 * 3、猜你喜欢的功能
 * 4、10天免登录
 * 5、多个页面之间的数据传递
 * 6、cookie实现购物车功能
 */
// 引入模块
const Koa = require('koa');
const router = require('koa-router')(); /*引入是实例化路由 推荐*/
const render = require('koa-art-template');
const path = require('path');

// 实例化
let app = new Koa();

// 配置 koa-art-template 模板引擎
render(app, {
  root: path.join(__dirname, 'views'), // 视图的位置
  extname: '.html', // 后缀名
  debug: process.env.NODE_ENV !== 'production' // 是否开启调试模式
})

router.get('/', async (ctx) => {
  // 正常就这样配置就可以了
  /**
    ctx.cookies.set('userinfo', 'zhangsan', {
      maxAge: 1000 * 60 * 60
    });
   */

  ctx.cookies.set('userinfo', 'zhangsan11', {
    maxAge: 1000 * 60 * 60,
    // path: '/news', /*配置可以访问的页面*/
    // domain: '.baidu.com', /*正常情况不要设置 默认就是当前域下面的所有页面都可以访问*/
    /**
     * a.baidu.com
     * b.baidu.com 共享cookie
     */
    httpOnly: false, // true表示这个cookie只有服务器端可以访问,false表示客户端(js)、服务器端都可以访问
  })

  let list = {
    name: '张三'
  }
  await ctx.render('index', {
    list: list
  })
})

router.get('/news', async (ctx) => {
  let userinfo = ctx.cookies.get('userinfo');

  let app = {
    name: '张三'
  }
  await ctx.render('news', {
    list: app
  });
})

app.use(router.routes());
app.use(router.allowedMethods());

app.listen(3000);

2.views/index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" href="css/basic.css" />
  <script>
    console.log(document.cookie);
  </script>
</head>

<body>
  <h2 class="title">这是一个koa-art-template</h2>
  <h2>绑定数据</h2>
  <%=list.name%>
</body>
</html>

views/news.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" href="css/basic.css" />
  <script>
    console.log(document.cookie);
  </script>
</head>

<body>
  <h2 class="title">这是一个koa-art-template</h2>
  <h2>绑定数据</h2>
  {{list.name}}
</body>

</html>

.

原文地址:https://www.cnblogs.com/crazycode2/p/10909305.html