前后端通信到底是怎样一个过程

news2024/11/17 13:46:19

前后端通信是怎样

前言：Http协议

超文本传输协议

规定：每一次前后端通信，前端需要主动向后端发出请求，后端接收到前端的请求后，可以给出响应

1、Http报文
  • 浏览器向服务器发送请求时，请求本身就是信息，叫请求报文
  • 服务器向浏览器发送响应时传输的信息，叫响应报文

报文格式

1、请求

请求头:起始行+首部

请求体（只有POST发送数据才有，GET没有）

（GET 请求，没有请求体，数据通过请求头携带；POST 请求，有请求体，数据通过请求体携带）

2、响应

响应头: 起始行+首部

响应体

image-20231004171757824

2、请求过程

image-20231004170508051

3、Http方法
  • GET 获取数据获取资源(文件)
  • POST 创建数据注册
  • PUT 更新数据修改个人信息，修改密码
  • DELETE 删除数据删除一条评论
4、RESTful 接口设计

一种接口设计风格，充分利用 HTTP 方法的语义

1、通过用户 ID 获取个人信息，使用 GET 方法

通常： https://wwwimooc.com/api/http/getUser?id=1

发挥GET语意： https://www.imooc.com/api/http/user?id=1

2、注册新用户，使用 POST 方法

通常： https://www.imooc.com/api/http/addUser

发挥POST语意：https://www.imooc.com/api/http/user

3、修改一个用户，使用 PUT 方法

通常：https://www.imooc.com/api/http/modifyUser

发挥POST语意：https://www.imooc.com/api/http/user

4、删除一个用户，使用 DELETE 方法

通常：https://www.imooc.com/api/http/deleteUser

发挥POST语意：https://www.imooc.com/api/http/user

5、GET和POST差别

1、缓存

GET 可以被缓存，POST 不会被缓存

2、安全性

GET 和 POST 都不安全

发送密码或其他敏感信息时不要使用 GET，主要是避免直接被他人窥屏或通过历史记录找到你的密码

6、Http状态码

定义服务器对请求的处理结果，是服务器返回的

100-199一般信息100 websocket_VScode自动刷新页面
200-299成功响应 200 OK
300-399重定向 301 Moved Permanently_永久老网址转新网址 /304_缓存有效
400-499客户端错误404 Not Found_自己错误,地址不存在
500-599服务端错误500 Internal Server Error

0、前后端数据交换的过程

1、浏览器和服务器之间数据交互的过程

2、客户端到后端服务器的交互

后端向前端发送数据

例如刷新浏览器网页，F12中的Network看到后端向浏览器推送JS文件，图片，html，css等（在命令行中curl命令，也可以与后端交互，但是浏览器的优点就是能展示出页面）

1、浏览器先拿到一个html文件

2、在或中有常用的<link引用css>，<img引用图片>，<script引用js>等外延标签，异步向服务器发送请求

3、例如<a超链接><form表单>，只有使用的时候发送请求

4、Ajax和Fetch

前端向后端发送数据

注册页面，接收数据，后端存储数据

1、浏览器构造http请求发给操作系统

协议：浏览器常用的http，https协议，文件协议file，远程传输协议ftp

域名：www.baidu.com 这就是域名，域名也对应着一个ip

端口：http协议的端口80，https是443，开发和测试环境常用的8080（常用的ssh链接是22端口）

路由/路径：访问网站默认到根部录下/index.html文件下

查询参数：在访问百度的时候，直接在wd跟上参数：https://www.baidu.com/s?wd=北京

image-20230929220213476

2、http请求转为ip包转发到公网

操作系统把http报文转换为tcp/ip 的包

把域名转为ip，先去查询本地host文件，后面再去查询DNS服务器

在这里就不得不提一下CDN内容加速网络了，那么CDN是如何实现网站的加速呢？

CDN内容分发网络：CDN+DNS共同实现用户的加速访问

原理：减少漫长的路由转发，就近访问备份资源

1、通过配置网站的CDN，提前让CDN的中间节点OC备份一份内容，在分发给用户侧的SOC边缘节点，这样就能就近拉取资源。不用每次都通过漫长的路由导航到源站。

2、但是要达到加速的效果，还需要把真实域名的IP更改到CDN的IP，所有这里还需要DNS的帮助，这里一般都会求助用户本地运营商搭建的权威DNS域名解析服务器，用户请求逐级请求各级域名，本来应该会返回真实的IP地址，但是通过配置会返回给用户一个CDN的IP地址，CDN的权威服务器再讲距离用户最近的那台CDN服务器IP地址返回给用户，这样就实现了CDN加速的效果。

image-20230929222126129

客户端通过cookie和session保持会话，确保来自同一客户端。例如：保存购物车信息等

image-20230930215319786

3、http请求转为ip包转发到公网

路由转发

4、获取并且返回文件

浏览器加载内容: html,css,js 渲染&执行脚本

前端路由解析

JS发送AJAX 请求：1、本域的api的后台 2、跨域第三方的服务器

image-20230930172236841

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1060161.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

ROS导航——环境感知（激光雷达）

ROS导航——环境感知（激光雷达）

下载相关驱动包&#xff08;激光雷达厂商应该会给出&#xff09; 编译后可能会出现部分错误&#xff0c;以下是部分情况&#xff1a; &#xff08;1&#xff09; 移植功能包后出现c文件无法找到头文件的情况&#xff1a;解决链接 修改代码&#xff1a;&#xff08;以我的雷达为…
阅读更多...
将pyc文件转换为py文件

将pyc文件转换为py文件

1.首先将pip版本升级 pip install --upgrade pip 2.然后安装uncompyle6 pip install uncompyle6 3.在系统的环境变量中&#xff0c;添加“python_home” 4.在系统变量Path中添加&#xff1a; %python_home%\Scripts\ 5.运行下面的代码&#xff0c;就会在你.pyc对应文件夹…
阅读更多...
腾讯云服务器完整建站过程（新手搭建网站教程）

腾讯云服务器完整建站过程（新手搭建网站教程）

使用腾讯云服务器搭建网站全流程&#xff0c;包括轻量应用服务器和云服务器CVM建站教程&#xff0c;轻量可以使用应用镜像一键建站&#xff0c;云服务器CVM可以通过安装宝塔面板的方式来搭建网站&#xff0c;腾讯云服务器网分享使用腾讯云服务器建站教程&#xff0c;新手站长搭…
阅读更多...
第二章 进程与线程 十九、管程

第二章 进程与线程 十九、管程

目录 一、定义 管程是一种特殊的软件模块&#xff0c;由以下部分组成&#xff1a; 二、管程的基本特征 三、使用管程解决生产者消费者问题 四、总结 一、定义 管程是一种特殊的软件模块&#xff0c;由以下部分组成&#xff1a; 1、局部于管程的共享数据结构说明;&#xf…
阅读更多...
[QT编程系列-45]: 内存检测工具Dr.Memory在Windows上的使用实践与详解

[QT编程系列-45]: 内存检测工具Dr.Memory在Windows上的使用实践与详解

目录 一、使用前的澄清 二、下载地址 三、功能概述 四、 使用方法与步骤 4.1 常见命令 4.2 命令选项详解 4.3 常见问题监测 4.3.1 内存泄露相关参数 4.4 结果输出参数 4.5 输出分析 一、使用前的澄清 &#xff08;1&#xff09;之前在https://blog.csdn.net/fengbin…
阅读更多...
SNAP与Sen2Cor下载与安装

SNAP与Sen2Cor下载与安装

SNAP软件下载与安装 一、下载地址 首先进入网站 找到DOWNLOAD下载页&#xff0c; 安装完成后&#xff0c;界面如下 还需要再装一个Sen2cor下载好之后&#xff0c;解压到用户文件夹下 然后打开L2A_Process.bat文件 打开CMD&#xff0c;输入 cd C:\Users\lenovo\AppData\L…
阅读更多...
【算法训练-二分查找 一】【基本二分】二分查找、在排序数组中查找元素的第一个和最后一个位置

【算法训练-二分查找 一】【基本二分】二分查找、在排序数组中查找元素的第一个和最后一个位置

废话不多说&#xff0c;喊一句号子鼓励自己&#xff1a;程序员永不失业&#xff0c;程序员走向架构&#xff01;本篇Blog的主题是螺旋矩阵&#xff0c;使用【二维数组】这个基本的数据结构来实现 二分查找【EASY】 从最简单的二分查找入手&#xff0c;进而开始解决一系列其变体…
阅读更多...
【Linux基础】Linux云服务器（腾讯云、阿里云、华为云）环境部署 | 安装远程XShell | 基本账号管理（超详细教程）

【Linux基础】Linux云服务器（腾讯云、阿里云、华为云）环境部署 | 安装远程XShell | 基本账号管理（超详细教程）

&#x1f449; 系列专栏&#xff1a;【LLinux基础】 &#x1f648; 个人主页&#xff1a;sunnyll 目录 一、前言 二、 Linux环境安装 &#x1f4a6; Linux 环境的搭建方式 &#x1f4a6;如何购买云服务器 三、 安装远程控制XShell &#x1f4a6;下载 XShell &#x1f4…
阅读更多...
阿里云对象存储OSS SDK的使用

阿里云对象存储OSS SDK的使用

官方文档 https://help.aliyun.com/zh/oss/developer-reference/java 准备工作 windows安装好JDK&#xff0c;这里使用JDK1.8为例 windows安装好IDEA&#xff0c;这里使用IDEA2022 登录阿里云控制台&#xff0c;通过免费试用OSS或开通OSS 步骤 配置访问凭证 有临时和长期…
阅读更多...
STM32F4学习笔记读取芯片UID和MAC地址

STM32F4学习笔记读取芯片UID和MAC地址

一、简介 在嵌入式设备开发过程中有时会需要为设备设置唯一的ID用以标识设备唯一&#xff0c;比如要求同一总线上的所有设备ID不能重复&#xff0c;要求设备具体唯一的MAC地址等等。每个STM32微控制器都自带一个96位的唯一ID&#xff0c;这个ID在任何情况下都是唯一且不允许修…
阅读更多...
谷歌地球引擎GEE账户注册的快速、百分百成功方法

谷歌地球引擎GEE账户注册的快速、百分百成功方法

本文介绍免费注册谷歌地球引擎&#xff08;Google Earth Engine&#xff0c;GEE&#xff09;账户的方便、快捷的最新方法&#xff1b;基于这一方法&#xff0c;只要我们创建一个谷歌Cloud Project&#xff0c;就可以直接访问GEE。 GEE在原本&#xff08;大概前几年的时候&#…
阅读更多...
day 10.4

day 10.4

服务器 头文件 #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include <QLine> #include <QTcpServer> #include <QTcpSocket> #include <QMessageBox>QT_BEGIN_NAMESPACE namespace Ui { class Widget; } QT_END_NAMESPACEclass Wid…
阅读更多...
Java中如何实现定时任务？

Java中如何实现定时任务？

文章目录 定时任务基本介绍前言基本概念介绍线程类实现定时任务Thread类实现定时任务Runnable接口实现定时任务Callable接口实现定时任务 Timer实现定时任务Timer的常用方法Timer的优缺点schedule和scheduleAtFixedRate的区别代码示例 ScheduledExecutorService实现定时Schedul…
阅读更多...
僵尸进程的产生与处理

僵尸进程的产生与处理

僵尸进程&#xff08;Zombie Process&#xff09;是指在操作系统中已经完成了执行&#xff0c;但其父进程尚未调用wait()或waitpid()来获取其终止状态的子进程。当一个进程结束时&#xff0c;操作系统会保留该进程的一些基本信息&#xff0c;包括进程ID&#xff08;PID&#xf…
阅读更多...
C++_pen_类

C++_pen_类

类的成员函数 构造函数析构函数普通成员函数 构造函数与析构函数 #include <stdio.h> class STU{ public:STU(){printf("STU\n");}STU(int id){printf("STU(int id)\n");}~STU(){printf("STU Bye!!!\n");} };int main(int argc, char c…
阅读更多...
图像分类概述

图像分类概述

图像分类概述 图像分类&#xff0c;也称图像识别&#xff0c;是计算机根据已有的固定分类标签集合和图像所反馈的信息特征从标签集合中找出一个分类标签&#xff0c;并分配给该图像的视觉处理方法。 譬如规定一个分类标签为猫和狗的集合&#xff0c;给计算机输入一张猫或狗的…
阅读更多...
【产品经理】国内企业服务SAAS平台的生存与发展

【产品经理】国内企业服务SAAS平台的生存与发展

SaaS在国外发展的比较成熟&#xff0c;甚至已经成为了主流&#xff0c;但在国内这几年才掀起热潮&#xff1b;企业服务SaaS平台在少部分行业发展较快&#xff0c;大部分行业在国内还处于起步、探索阶段&#xff1b;SaaS将如何再国内生存和发展&#xff1f; 在企业服务行业做了五…
阅读更多...
Linux友人帐之Vim编译器

Linux友人帐之Vim编译器

一、概述 1.1简介 Vim是从 vi 发展出来的一个文本编辑器。代码补完、编译及错误跳转等方便编程的功能特别丰富&#xff0c;在程序员中被广泛使用。 简单的来说&#xff0c; vi 是老式的字处理器&#xff0c;不过功能已经很齐全了&#xff0c;但是还是有可以进步的地方。 vim 则…
阅读更多...
OpenCV报错：AttributeError: module ‘cv2.cv2‘ has no attribute ‘SIFT_create‘

OpenCV报错：AttributeError: module ‘cv2.cv2‘ has no attribute ‘SIFT_create‘

报错位置&#xff1a; sift cv2.SIFT_create()报错原因&#xff1a;opencv将SIFT等算法整合到xfeatures2d集合里面了。 改为&#xff1a; sift cv2.xfeatures2d.SIFT_create()
阅读更多...
JavaSE入门--初始Java

JavaSE入门--初始Java

文章目录 Java语言概述认识Java的main函数main函数示例运行Java程序认识注释认识标识符认识关键字 前言&#xff1a; 我从今天开始步入Java的学习&#xff0c;希望自己的博客可以带动小白学习&#xff0c;也能获得大佬的指点&#xff0c;日后能互相学习进步&#xff0c;都能如尝…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023