先看一下源码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

// 创建路由
  const router = express.Router();
  app.use("/api", router);

  // 创建session
  const session = require('express-session');
  app.use(session({
      secret: 'dfafadfadfa', //秘钥
      resave: true,          //即使 session 没有被修改，也保存 session 值，默认为 true。
      saveUninitialized: true,//无论有没有session cookie，每次请求都设置个session cookie ，默认给个标示为 connect.sid
      cookie: ('name', 'value', { secure: false })//当 secure 值为 true 时，cookie 在 HTTP 中是无效，在 HTTPS 中才有效。
  }))
  
  router.use("/aaa",(req,res)=>{
      console.log(req.session)
  })

结果当访问到api/aaa地址时，node打印出来的是undefined

cookie、Local Storage、Session Storage 定义

Cookie（局限性）：用户可以禁用cookie，最多只能存储4kb，cookie有过期时间的（一般我们设置的时间最长1个月，用户使用杀毒软件也可以清除我们的cookie），cookie还需要指定作用域，不可以跨域调用。

LocalStorage：持久化存储到本地，没有过期时间，最大可存储5MB
都是采用的明文存储，我们在控制台（Resource）下可以看到存储的信息，所以本地存储都是不安全的（不要存储重要的信息，如果需要的话，我们需要对重要的信息进行严格的加密—md5加密）

WebStorage(localStorage(常用，sessionStorage))
由于我们的localStorage可以存储很多的数据，我们在项目中把不经常更新的数据进行存储，下一次打开页面，先把本地缓存的数据展示，减少对于服务器的请求压力—移动端的本地缓存。

sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。

有个终极方法解决数组和对象的相互转换问题

下面的两个例子都是es6语法。

1. 数组转换成对象：
   知识点： 扩展运算符…

   1 2 3

   let arr = [1,2,3]; let obj = {...arr}; console.log(obj); //{0: 1, 1: 2, 2: 3}

2. 对象转换成数组
   知识点： Object.values(obj)

   1 2	var obj = { 0: 'a', 1: 'b', 2: 'c' }; console.log(Object.values(obj)); // ['a', 'b', 'c']

下载到本地

想需要的图标加入购物车，然后添加至项目中，再选择下载至本地

先看效果图

代码阶段

由于这个canvas是我在vue项目里写的，所以为了照顾一下没学过vue的，就用了原生的js整理了一下，里面用到了一些es6的语法，包括class 模板字符串`` 等，代码里面都有注释。

css样式

1
2
3
4
5

div {
    width：100%;     /*必须是100%*/ 
    height:0;
    padding-top:100%  /*padding-bottom:100% 也行*/ 
}

这样会使元素的高度等于宽度，形成一个正方形。

一、定义

当打开一个有很多图片的页面时，先只加载页面上看到的图片，等滚动到页面下面时，再加载所需的图片。这就是图片懒加载。

二、作用

减少或延迟请求数，缓解浏览器的压力，增强用户体验。

三、实现方式

scrollX、scrollY和scrollTop、scrollLeft比较

• 相同点：都可以获取到滚动条的位置，都是window对象下的。bom对象
• 不同点：scrollX、scrollY只读不写;scrollTop、scrollLeft：可读可写

判断浏览器类型用的方法是

navigator.userAgent //取得浏览器的userAgent字符串
例子

首先第一条很重要

元素添加hover伪类选择器时候一定要紧贴这hover，不能有空格，有空格的话表示给该元素的所有子元素设置里hover样式。