1.app.jsjavascript
/** * cookie的簡介: * 一、cookie保存在瀏覽器客戶端 * 二、能夠讓咱們用同一個瀏覽器訪問同一個域名的時候共享數據 * * cookie的做用: * 一、保存用戶信息 * 二、瀏覽器歷史記錄 * 三、猜你喜歡的功能 * 四、10天免登陸 * 五、多個頁面之間的數據傳遞 * 六、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.htmlcss
<!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.htmlhtml
<!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>
.java