UNIAPP day_05(9.3) Cookie、WebStorage、Session 和 Token的区别、uni-app最终部署

列表页”编写公式：

 data —— kw:""、list:[ ]、pno:0、pageCount:99999、isLoading:false
  loadNextPageData(){
	//1 如果没有更多数据了，或者当前正在加载中，则退出
 	//2 设置“加载中”为真
	//3 异步请求服务器端数据
 	//4 设置“加载中”为假
  }
  情形1：页面挂载时，调用“加载下一页数据”
  情形2：滚动到页面底部时，调用“加载下一页数据”
  情形3：顶部下拉刷新时，清除已有数据，调用“加载下一页数据”

一、极重要面试题：Cookie、WebStorage、Session 和 Token

HTTP协议是“Stateless（无状态的）”，每个请求都会获得一个响应消息，响应结束后，服务器不会记录任何客户端的过往访问信息。
但是，实际项目中，用户登录之后，服务器需要一直显示当前用户的信息 —— 实现技术有四种：

1. Cookie：客户端存储——小点心，九十年代就有的技术；本质是服务器生成的“k=v”对，随着响应消息头(set-cookie)一起发送给客户端；客户端存储在内存或硬盘中。下次再发请求时，浏览器会自动携带之前保存在客户端所有Cookie给服务器(放在请求消息头cookie) —— 类似于“老板给顾客身上贴小标签”。
   提示：浏览器规定，每个服务器在客户端可以保存的Cookie键值对数据量有限制（例如4KB）
2. WebStorage：客户端存储——2015年HTML5提供的新技术，分为sessionStorage/localStorage两个对象，本质是服务器返回给客户端的数据，客户端自己保存在浏览器内存或磁盘上。下次请求时，客户端自己从WebStorage中读取数据，作为请求数据发送给服务器 —— 类似于“顾客主动拿走老板写的小标签”。
   提示：浏览器规定，每个服务器在客户端可以保存的WebStorage键值对数据量有限制（例如8MB）
3. Session：服务器端存储——九十年代末，Java和PHP和.NET等服务器端技术厂家提出的技术；本质服务器为客户端开辟了一段存储空间（保存在服务器端内存/文件/数据库中），以Cookie形式返回给客户端一个“会话编号（就是一个数字）”；客户端再次访问时，会自动出示此“会话编号”，服务器据此识别出该用户并找到之前存储的信息—— 类似于“老板给顾客办会员卡(号）”。
   提示：session技术安全性比客户端存储高；但是会增加服务器端处理负担，尤其是大数据/高并发的项目中。
4. Token：客户端存储——令牌，最新技术；本质是服务器把客户端之前的访问数据都保存在一个对象中（数据大小无限制），使用加密技术加密为一个长度固定的密文字符串（该密文称为令牌），以响应消息头/主体形式发送给客户端；客户端需要存储在WebStorage中，下次请求时，以请求参数/消息头/主体形式发送该令牌给服务器；服务器收到该令牌检查其完整性，解密其中的信息，从而获得该客户端之前的访问数据 —— 类似于“老板用只有自己懂的鸟语把顾客的信息写在纸条上，让顾客带回家”。

使用token实现“登录后获取个人信息”

	客户端	服务器
第一步：登录	发送简单请求	把客户端信息保存在一个对象中，加密为token字符串；返回响应消息{code:200, msg: 'login succ',token: '加密后的字符串'}
	接收到响应消息，把其中的token保存在客户端uni.setStorageSync(‘ServerToken’, token)
第二步：获取个人档案	从客户端读取之前保存的token let token=uni.getStorageSync('ServerToken')
	发送请求消息，把token放在请求消息头中（与后端协商好的请求头）GET /user/get_basic.php HTTP1.1authorization: ‘‘加密后的字符串’’	接收到请求消息，从请求头中读取authorization（即token），解密令牌从中读取客户端信息（如用户编号），查询数据库，返回响应消息

二、补充：uni-app更多的API

uni.setStorage() 在客户端存储键值对数据（异步的）
uni.setStrorageSysnc() 在客户端存储键值对数据（同步的）
uni.getStorage() 读取保存在客户端的键值对数据（异步的）
uni.getStrorageSysnc() 读取保存在客户端的键值对数据（同步的）

三、uni-app项目的最终发布部署

项目的两种运行模式：
①调试模式/开发模式/运行模式(Development Mode) —— npm start
代码没有经过压缩和优化，所以代码体积比较大 —— 会自动连接开发服务器，自动更新
②生产模式/部署模式/发行模式(Production Mode) —— npm run build：
代码经过优化和压缩，所以代码体积比较小 —— 不能再自动连接开发服务器

演示1：把uni-app发布为“生产模式”的H5网站
点击当前项目，点击工具栏 “发行”>“网站-PCWeb或手机H5”；
成功后，编译后的结果保存在 @/unpackage/dist/build/h5 目录下，该目录下的内容复制到任意真实的云服务器上的WEB服务器上即可。

演示2：把uni-app发布为“生产模式”的微信小程序
点击当前项目，点击工具栏 “发行”>“小程序-微信”；
输入小程序名称 和 腾讯提供的小程序AppID，点击发布即可。
由于腾讯的限制，小程序访问的第三方域名（例如：http://www.codeboy.com）必须在“小程序控制台>request合法域名”列表中声明一下，否则小程序是禁止访问第三方域名的。

演示3：把uni-app发布为“生产模式”的App
编辑项目清单文件manifest.json，修改应用名称 和 图标 和 App权限配置（勾选）；如果想安装到夜神模拟器，还需要勾选 “App常用其它设置>x86”
点击当前项目，点击工具栏 “发行”>“原生App-云打包”>修改“使用测试证书”>选择 “安心打包”>点击 “开始打包”；项目开始自动编译，完成后自动提交到DCloud服务器进行打包；等待一段时间…
打包成功后，会提示“APK文件创建成功，保存在@/unpackage/dist/build/apk”目录下；
可以重命名.apk文件，发布到应用商店 或者 放到自己的网站上供人下载 或者 直接把安装文件拷贝(用数据线或QQ)到自己的手机中，开始安装&启动App…