在小程序中如何实现下拉刷新和上拉加载更多?
onPullDownRefresh 下拉刷新
onReachBottom 上拉加载
@小程序的微信授权流程
在小程序端wx.login()得到登录码code
小程序请求自家的登录接口,携带登录码code
自家服务器请求微信服务器,使用appid+appSecret+code换回session_key与openid
自家服务器将session_key与openid重新换算为自家的登录信息(如token)
小程序在后续请求自家服务器的过程中都携带该token,自家服务器就知道小程序端已经登录过了
@微信支付流程
用户点击下单;
调用`wx.login` 获取临时登录凭证`code`,发送到后端换取`openId`;
将`商品信息(id、数量等)+ 用户的openId`一并通过**购买接口**发送服务端;
服务器综合以上信息`生成订单+签名`(根据微信支付SDK要求生成),向微信支付后台发送支付请求,获取其返回的`预付款订单id(prepay_id)`,同时再次根据微信支付SDK要求生成`预付款订单签名`,二者一并响应给小程序端;
小程序端调用`wx.requestPayment()`发起微信支付,此时微信内部的支付窗口被唤醒,用户输入支付密码或指纹;
微信支付后台处理支付,将结果同时推送给小程序端和我们自己的服务端;
@微信小程序的发布流程
在uni-app端完成微信小程序的打包;
在微信开发者工具中将代码上传到微信公众平台,形成体验版;
测试人员根据扫描体验版二维码进行最后的测试工作;
测试通过后,点击提交审核,进入审核流程,通常24小时就能出结果;
审核通过后,用户即可通过维系小程序搜索到我们的小程序;同时我们还可以在微信公众平台生成小程序的葵花码,交给推广人员进行推广;
HTTP 和 HTTPS 的区别?
HTTPS是HTTP协议的安全版本。HTTPS的出现主要是为了解决HTTP明文传输内容导致其不安全的特性。为保证数据加密传输,让HTTP运行安全的SSL/TLS协议上,即 HTTPS = HTTP + SSL/TLS。通过SSL证书来验证服务器的身份,并为浏览器和服务器之间的通信进行加密。
二者的区别:
安全性:`HTTP`协议的数据传输是明文的,是不安全的;`HTTPS` 使用了`SSL/TLS`协议进行加密处理,相对更加安全。
连接方式:二者使用的连接方式不同,`HTTP`是三次握手,`HTTPS`是三次握手+数字证书。
默认端口:`HTTP`的默认端口是`80`;`HTTPS`的默认端口是`443`。
响应速度:由于`HTTPS`需要进行加解密过程,因此速度不如`HTTP`。
费用:`HTTPS`需要使用`SSL`证书,功能越强大的证书其费用越高;`HTTP`不需要。
HTTP 状态码有哪些?
`101`:服务器根据客户端的请求切换协议,主要用于`websocket`或`http2`升级
`200`:请求已成功
`201`:请求成功并且服务器创建了新的资源。
`202`:服务器已接受响应请求,但尚未处理。
`301`:永久重定向
`302`:临时重定向
`304`:本次获取到的内容是读取缓存中的数据,会每次去服务器校验。
`401`:请求需要进行身份验证,尚未认证,没有登录网站。
`403`:禁止访问,服务器拒绝请求。
`404`:服务器没有找到相应资源。
`500`:服务器遇到错误,无法完成对请求的处理。
`503`:服务器无法使用。
`400` : 请求失败!请您稍后重试。
`401`: 登录失效!请您重新登录。
`403`:当前账号无权限访问。
`422`: 请求格式正确,但是由于含有语义错误,无法响应。
`404`: 你所访问的资源不存在。
`405`:"请求方式错误!请您稍后重试。
`408`:"请求超时!请您稍后重试。`500`: 服务异常。
`502`:网关错误。
`503`:服务不可用。
`504`:网关超时。
TCP 的三次握手和四次挥手?
三次握手🤝:
第一次握手:客户端给服务器发送一个`SYN`报文。
第二次握手:服务器应答一个`ACK`报文,同时发出自己的`SYN`报文,即应答了一个`SYN + ACK`报文。
第三握手:客户端收到`SYN + ACK`报文后,回应一个`ACk`报文。服务器收到`ACK`报文之后,三次握手完毕。
四次挥手🙋:
第一次挥手:客户端认为没有数据需要继续发送,于是向服务器发送一个`FIN`报文,申请断开客户端到服务器端的连接
第二次挥手:服务器接收到`FIN`报文后,向客户端发送一个确认报文`ACK`,表示已经接收到了客户端释放连接的请求,,服务端处于`CLOSE_WAIT`状态。但是服务器仍可以发送数据给客户端)。
第三次挥手:服务器端发送完所有的数据,会向客户端发送一个`FIN`报文,申请断开服务器端到客户端的连接。此时,服务器进入`LAST_ACK` 状态。
第四次挥手:客户端接收到`FIN`报文之后,向服务器发送一个`ACK`报文作为应答,就会立即进入`CLOSED`状态。
从输入URL到看到页面的过程,发生了什么?
`url解析`:首先会判断输入的是一个合法 url还是关键词,并根据输入的内容进行相应的操作。
`查找缓存`:浏览器会判断所请求的资源是否在浏览器缓存中,以及是否失效。如果没有失效就直接使用;如果没有缓存或失效了,就继续下一步。
`DNS解析`:此时需要获取url中域名对应的IP地址。浏览器会依次查看`浏览器缓存`、`操作系统缓存`中是否有ip地址,如果缓存中没有就会向`本地域名服务器`发起请求,获取ip地址。`本地域名服务器`也会先检查缓存,有则直接返回;如果也没有,则采用`迭代查询`方式,向上级域名服务器查询。先向`根域名服务器`发起请求,获取`顶级域名服务器`的地址;再向`顶级域名服务器`发起请求以获取`权限域名服务器`地址;然后向`权限域名服务器`发起请求并得到url中域名对应的IP地址。
`建立TCP连接`:根据ip地址,`三次握手`与服务器建立TCP连接。
`发起请求`:浏览器向服务器发起HTTP请求。
首屏加载的优化方法:
充分利用浏览器请求并发优势(请求并发数6)针对加载中的大文件进行拆分
对不涉及到公司核心业务的文件进行cdn加速。
对于涉及到公司的核心业务的文件但不是首屏渲染所必须的我们可以按需加载(路由配置)
配置代码压缩和gzip(1300K ==> 900K ==> 100K)
图标尽量使用svg图标 对静态资源图片压缩
使用loading图或骨架屏缓解用户等待焦虑
构建速度优化
配置extensions后缀名数组 高频的放数组前面 低频的放后面,极端做法就是引入模块都定义后缀名,减少打包试探的次数
通过exclude和include来缩小loader的处理范围 include提升更加明显
对没有其他第三方依赖的js库配置noParse选项来忽略它,提升构建性能(jquery、loadash) ?
thread-loader开启多线程
升级webpack版本到5.x
配置cache选项type为filesystem打开持久化缓存(webpack4.x dll动态链接库)