uni-app进阶之https请求方式/状态管理【day11】

简介: uni-app进阶之https请求方式/状态管理【day11】

uni-app进阶之https请求方式

传统HTTP存在安全问题:
1.如果明文用于通信,则内容可能被窃听;
2.如果未验证通信方的身份,通信方的身份可能被伪装;
3.无法证明消息的完整性,消息可能被篡改。
为了解决安全通信问题,HTTPS应运而生。事实上,HTTPS并不是一种新的协议。相反,它站在HTTP的肩膀上,让HTTP首先与SSL(安全套接字层)通信,然后与SSL和TCP通信。也就是说,HTTPS使用隧道进行通信。通过使用SSL,HTTPS具有加密(防窃听)、身份验证(防欺骗)和完整性保护(防篡改)。
在这里插入图片描述

HTTP plus加密、身份验证机制和完整性保护是HTTPS。
重要的是要知道HTTPS不是应用层的新协议。只有HTTP通信接口部分被SSL或TLS协议替换。换句话说,所谓的HTTPS实际上是SSL协议外壳中的HTTP。

非对称密钥加密

每个人都可以获得公钥。通信发送方获得接收方的公钥后,可以使用该公钥进行加密。接收方接收到通信内容后,可以使用私钥进行解密。除了加密之外,还可以使用非对称密钥进行签名。由于私钥无法被他人获取,通信发送方使用其私钥进行签名,通信接收方使用发送方的公钥对签名进行解密,从而可以判断签名是否正确。
在这里插入图片描述

SSL为完整性保护提供消息摘要功能。HTTP还提供MD5消息摘要功能,但不安全。例如,如果消息内容被篡改,同时重新计算MD5值,则通信接收方不知道该篡改。
HTTPS的消息摘要功能是安全的,因为它结合了加密和身份验证。想象一下,在加密的消息被篡改后,很难重新计算消息摘要,因为无法轻松获取明文。

条件编译的代码块源码

"#ifdef": {
        "body": [
            "<!-- #ifdef ${1:APP-PLUS/APP-VUE/APP-NVUE/MP/MP-ALIPAY/MP-BAIDU/MP-WEIXIN/MP-QQ/MP-TOUTIAO/MP-360/H5/QUICKAPP-WEBVIEW-HUAWEI/QUICKAPP-WEBVIEW-UNION/QUICKAPP-WEBVIEW} -->",
            "$0",
            "<!-- #endif -->"
        ],
        "prefix": "ifdef",
        "project": "uni-app",
        "scope": "source.vue.html"
    },
    "#ifndef": {
        "body": [
            "<!-- #ifndef ${1:APP-PLUS/APP-VUE/APP-NVUE/MP/MP-ALIPAY/MP-BAIDU/MP-WEIXIN/MP-QQ/MP-TOUTIAO/MP-360/H5/QUICKAPP-WEBVIEW-HUAWEI/QUICKAPP-WEBVIEW-UNION/QUICKAPP-WEBVIEW} -->",
            "$0",
            "<!-- #endif -->"
        ],
        "prefix": "ifndef",
        "project": "uni-app",
        "scope": "source.vue.html"
    },

系统帮助我们预设四个代码块文件。单击菜单栏-工具-代码块设置查看它们:HTML代码块(HTML.json)、CSS代码块(CSS.json)、JavaScript代码块(JavaScript.json)和Vue代码块(Vue.json)。

添加状态管理vuex

在这里插入图片描述

下拉刷新

数据请求完成之后停止下拉刷新

export default {
    data: {
        text: 'uni-app'
    },
    onShow: function (options) {
      this.loadData();
    },
    onPullDownRefresh() {
      this.loadData()
    }
   methods:{
       loadData() {
                this.$http('/data', {}, 'get').then((res) => {
                    uni.stopPullDownRefresh();
                    if (res.status) {
                        this.activityList = res.data
                    }
                })
            }
      }
}

在这里插入图片描述

相关文章
|
3月前
|
应用服务中间件 nginx
百度搜索:蓝易云【HTTP请求是如何关联Nginx server{}块的?】
总结来说,Nginx中的 `server{}`块用于关联HTTP请求和虚拟主机,通过配置不同的 `server{}`块,可以实现多个域名或IP地址的请求分发和处理。这样,Nginx可以根据不同的请求来提供不同的服务和内容。
37 0
|
3月前
|
存储 缓存 API
HTTP 请求的响应头部字段 Cache-Control 的值为 no-store 是什么意思
HTTP 请求的响应头部字段 Cache-Control 的值为 no-store 是什么意思
62 0
|
3月前
|
JavaScript
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)(上)
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
29 0
|
3月前
|
JavaScript
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)(下)
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
26 0
|
1月前
|
数据采集 缓存 前端开发
http和https请求服务器的时候在请求头部分都带什么到服务器呢?
HTTP和HTTPS请求头基本结构相似,HTTPS多了一层SSL/TLS加密。常见请求头如Accept(指定内容类型)、Authorization(身份验证)、Cookie(会话跟踪)、User-Agent(标识用户代理)等。HTTPS特有的头包括Upgrade-Insecure-Requests(升级到HTTPS)、Strict-Transport-Security(强制使用HTTPS)、Sec-Fetch-*(安全策略)和X-Content-Type-Options、X-Frame-Options等(增强安全性)。实际应用中,请求头会根据需求和安全策略变化。
20 0
|
1月前
|
前端开发 API 数据处理
uni-app 封装api请求
uni-app 封装api请求
15 0
|
3月前
|
Java API Spring
使用OkHttp在Spring Boot应用中发送HTTP请求
使用OkHttp在Spring Boot应用中发送HTTP请求
81 0
|
3月前
|
存储 缓存 安全
面试题:HTTP 协议包括哪些请求?
面试题:HTTP 协议包括哪些请求?
24 0
|
3月前
|
移动开发 自然语言处理 网络协议
Http解析实现/服务器Get请求的实现
Http解析实现/服务器Get请求的实现
46 0
|
3月前
|
Web App开发 网络协议 Linux
Linux C/C++ 开发(学习笔记十 ):实现http请求器(TCP客户端)
Linux C/C++ 开发(学习笔记十 ):实现http请求器(TCP客户端)
49 0