11.koa基礎之cookie 的基本使用 · koa實戰

cookie.html ``` ~~~ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <script> console.log(document.cookie); </script> <body> {{list.name}} </body> </html> ~~~ ``` 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('cookie', { list: list }) }); router.get('/news', async (ctx) => { let userinfo = ctx.cookies.get('userinfo'); let app = { name: '張三' }; await ctx.render('cookie-news', { list: app }); }); app.use(router.routes()); app.use(router.allowedMethods()); app.listen(8000); ~~~ ``` cookie-news.html ``` ~~~ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <script> console.log(document.cookie); </script> <body> {{list.name}} </body> </html> ~~~ ```