当前位置: 首页 > news >正文

Web开发核心

文章目录

  • 1.http协议简介
  • 2.http协议特性
  • 3.http请求和响应协议
  • 4.最简单的Web程序
  • 5.基于flask搭建web⽹站
  • 6.浏览器开发者⼯具(重点)

1.http协议简介

HTTP协议是Hyper Text Transfer Protocol(超文本传输协议)的缩写,是用于
万维网(WWW:Norld Wide Web)服务器与本地浏览器之间传输超文本的
传送协议。HTTP是一个属于应用层的面向对象的协议,由于其简捷、快速
的方式,适用于分布式超媒体信息系统。它于1990年提出,经过几年的使
用与发展,得到不断地完善和扩展。HTTP协议工作于客户端服务端架构为
上。浏览器作为HTTP客户端通过URL向HTTP服务端即WEB服务器发送所有
请求。Web服务器根据接收到的请求后,向客户端发送响应信息。
![[Pasted image 20240525200441.png]]

2.http协议特性

  1. 基于TCP/IP协议
    http协议是基于TCP/IP协议之上的应用层协议。
  2. 基于请求一响应模式
    HTTP协议规定,请求从客户端发出,最后服务器端响应该请求并返回。换句话说,肯定
    是先从客户端开始建立通信的,服务器端在没有接收到请求之前不会发送响应
  3. 无状态保存
    HTTP是一种不保存状态,即无状态(stateless)协议。HTTP协议自身不对请求和响
    应之间的通信状态进行保存。也就是说在“TTP这个级谜别,协议对于发送过的请求或响
    应都不做持久化处理。
    使用HTTP协议,每当有新的请求发送时,就会有对应的新响应产生。协议本身并不保
    留之前一切的请求或响应报文的信息。这是为了更快地处理大量事务,确保协议的可
    伸缩性,而特意把HTTP协议设计成如此简单的。
  4. 短连接和长连接
    HTTP1.O默认使用的是短连接。浏览器和服务器每进行一次HTTP操作,就建立一次
    连接,任务结束就中断连接。
    HTTP/1.1起,默认使用长连接。要使用长连接,客户端和服务器的HTTP首部的
    Connection都要没置为keep-a]iye,才能支特长连接HTTP长连接,指的是复用TCP连接。多个HTTP请求可以复用同一个TCP连接,这就节省了TCP连接建立和断开的消耗。

3.http请求和响应协议

![[Pasted image 20240525200948.png]]

htp协议包含由浏览器发送数据到服务器需要遵循的请求协议与服务器发送数据到浏览器需要遵循的请求协议。用于HTTP协议交互的信被为HTTP报文。请求端(客户端)的HTTP报文做请求报文,响应端(服务器端)的做响应报文。HTTP报文本身是由多行数据构成的字文本。
![[Pasted image 20240525201022.png]]

一个完整的URL包括:协议、ip、端口、路径、参数
例如:https:/www.baidu.com/s?wd=yuan
其中https是协议,www,baidu.com是IP,端口默认80,/s是路径,参数是wd=yuan请求方式:get与post请求GET提交的数据会放在URL之后,以?分割URL和传输数据,参数之
间以&相连,如EditBook?name=test1&id=123456.P0ST方法是把提交
的数据放在HTTP包的请求体中
GET提交的数据大小有限制(因为浏览器对URL的长度有限制),而POST方法提交的数据没有限制
响应状态码:状态码的职是当客户端向服务器端发送请求时,返回的请求结果。借助状态码,用户可以知道服务器端是正常理了请求,还是出现了。状态码如2000K,以3位数字和原因组成。

4.最简单的Web程序

import socket  sock = socket.socket()  
sock.bind(("127.0.0.1", 7777))  
sock.listen(3)  print("服务器已启动..")  
while True:  conn, addr = sock.accept()  data = conn.recv(1024)  print("收到请求:", data.decode())  response = """HTTP/1.1 200 OK\r\nContent-Type: text/html\r\n\r\n  <h1>Hello, World!</h1>    <img src='https://img0.baidu.com/it/u=4011424408,4733765&fm=253&fmt=auto&app=138&f=JPEG?W=500&h=750'>"""  conn.sendall(response.encode())  conn.close()

5.基于flask搭建web⽹站

from flask import Flask, render_template  
import datetime  app = Flask(__name__, template_folder="templates")  @app.route("/index")  
def index():  return render_template("index.html")  @app.route("/timer")  
def timer():  now = datetime.datetime.now().strftime("%Y-%m-%d %X")  return render_template("timer.html", now=now)  app.run()

6.浏览器开发者⼯具(重点)

(1)Elements
(2)Network
(3)Application

相关文章:

Web开发核心

文章目录 1.http协议简介2.http协议特性3.http请求和响应协议4.最简单的Web程序5.基于flask搭建web⽹站6.浏览器开发者⼯具&#xff08;重点&#xff09; 1.http协议简介 HTTP协议是Hyper Text Transfer Protocol(超文本传输协议)的缩写&#xff0c;是用于 万维网(WWW:Norld W…...

【Python】【Scrapy 爬虫】理解HTML和XPath

为了从网页中抽取信息&#xff0c;必须对其结构有更多了解。我们快速浏览HTML、HTML的树状表示&#xff0c;以及在网页上选取信息的一种方式XPath。 HTML、DOM树表示以及XPath 互联网是如何工作的&#xff1f; 当两台电脑需要通信的时候&#xff0c;你必须要连接他们&#xff…...

【CTF Web】CTFShow web5 Writeup(SQL注入+PHP+位运算)

web5 1 阿呆被老板狂骂一通&#xff0c;决定改掉自己大意的毛病&#xff0c;痛下杀手&#xff0c;修补漏洞。 解法 注意到&#xff1a; <!-- flag in id 1000 -->拦截很多种字符&#xff0c;连 select 也不给用了。 if(preg_match("/\|\"|or|\||\-|\\\|\/|\…...

LeetCode 968.监控二叉树 (hard)

968.监控二叉树 力扣题目链接(opens new window) 给定一个二叉树&#xff0c;我们在树的节点上安装摄像头。 节点上的每个摄影头都可以监视其父对象、自身及其直接子对象。 计算监控树的所有节点所需的最小摄像头数量。 贪心思路&#xff1a; 从下往上看&#xff0c;局部最…...

数理逻辑:1、预备知识

17.1 命题和联结词 ​ 命题&#xff1a;可以判定真假的陈述句。&#xff08;则悖论&#xff0c;祈使句&#xff0c;疑问句都不是命题&#xff09; ​ 原子命题&#xff1a;不能被分割为更小的命题的命题 例如&#xff1a; 2既是素数又是偶数 可以由$p: 2 是素数&#xff0c;…...

14-云原生监控体系-Redis_exporter 监控 MySQL[部署Dashborad告警规则实战]

文章目录 环境准备切片集群主从哨兵1. 部署1.1. 二进制方式1.1.1. 下载二进制包1.1.2. 部署1.2. docker-compose 容器方式1.3. 配置连接&认证参数1.3.1. 连接认证参数1.3.2. 配置服务控制 systemd2. 配置到 Prometheus3 Dashboard4. 告警规则...

DOS学习-目录与文件应用操作经典案例-xcopy

新书上架~&#x1f447;全国包邮奥~ python实用小工具开发教程http://pythontoolsteach.com/3 欢迎关注我&#x1f446;&#xff0c;收藏下次不迷路┗|&#xff40;O′|┛ 嗷~~ 目录 一.前言 二.使用 三.案例 一.前言 xcopy命令是DOS系统中一个强大的文件和目录复制工具&…...

Midjourney是一个基于GPT-3.5系列接口开发的免费AI机器人

Midjourney是一个基于GPT-3.5系列接口开发的免费AI机器人&#xff0c;旨在提供多领域的智能对话服务。Midjourney在不同领域中有不同的定义和应用&#xff0c;以下是对其中两个主要领域的介绍&#xff1a; Midjourney官网&#xff1a;https://www.midjourney.com/ 一、AI绘画工…...

v-model详解

目录 原理 作用 表单类组件封装 ​编辑v-model简化代码 原理 v-model本质上是一个语法糖。例如应用在输入框上&#xff0c;就是value属性和input属性的合写。 作用 提供数据的双向绑定。 数据变&#xff0c;视图跟着变:value视图变&#xff0c;数据跟着变input 注意&…...

ArcGIS中分割与按属性分割的区别

1、分割ArcGIS批量导出各个市的县级行政边界 视频教学&#xff1a; ArcGIS批量导出各个市的县级行政边界002 2、ArcGIS批量导出全国各省的边界 视频教学&#xff1a; ArcGIS导出全国各省的边界003 推荐学习&#xff1a; ArcGIS全系列实战视频教程——9个单一课程组合系列直播回…...

就业班 第三阶段(ELK) 2401--5.20 day1 ELK 企业实战 ES+head+kibana+logstash部署(最大集群)

ELKkafkafilebeat企业内部日志分析系统 1、组件介绍 1、Elasticsearch&#xff1a; 是一个基于Lucene的搜索服务器。提供搜集、分析、存储数据三大功能。它提供了一个分布式多用户能力的全文搜索引擎&#xff0c;基于RESTful web接口。Elasticsearch是用Java开发的&#xff…...

PCM和QAM

PCM&#xff08;脉冲编码调制&#xff09;和QAM&#xff08;正交振幅调制&#xff09;是两种不同的信号调制技术&#xff0c;它们在通信系统中有着不同的应用和特点。 PCM&#xff08;脉冲编码调制&#xff09; 概述 PCM是一种数字信号处理技术&#xff0c;用于将模拟信号转…...

Mongodb分布式id

1、分布式id使用场景 分布式ID是指在分布式系统中用于唯一标识每个元素的数字或字符串。在分布式系统中&#xff0c;各个节点或服务可能独立运行在不同的服务器、数据中心或地理位置&#xff0c;因此需要一种机制来确保每个生成的ID都是全局唯一的&#xff0c;以避免ID冲突。 …...

AI模型抉择:开源VS闭源,谁主沉浮?

AI模型抉择&#xff1a;开源VS闭源&#xff0c;谁主沉浮&#xff1f; &#x1f604;生命不息&#xff0c;写作不止 &#x1f525; 继续踏上学习之路&#xff0c;学之分享笔记 &#x1f44a; 总有一天我也能像各位大佬一样 &#x1f3c6; 博客首页 怒放吧德德 To记录领地 &am…...

佩戴安全头盔监测识别摄像机

佩戴安全头盔是重要的安全措施&#xff0c;尤其在工地、建筑工程和工业生产等领域&#xff0c;安全头盔的佩戴对于工人的生命安全至关重要。为了更好地管理和监控佩戴安全头盔的情况&#xff0c;监测识别摄像机成为了一项重要的工具。监测识别摄像机可以通过智能技术监测并记录…...

5.24学习记录

[FSCTF 2023]ez_php2 比较简单的pop链 <?php highlight_file(__file__); Class Rd{public $ending;public $cl;public $poc;public function __destruct(){echo "All matters have concluded";die($this->ending);}public function __call($name, $arg){for…...

创建FreeRTOS工程

创建STM32CubeMX工程 配置时钟 配置FreeRTOS 生成Keil MDK的工程 打开工程 结尾 这就是我们用STM32CubeMX创建的最基本的一个FreeRTOS的工程。可以看到&#xff0c;这个与我们使用stm32开发的裸机程序有相同的地方&#xff0c;也有不同的地方&#xff0c;我们可以发现&am…...

HTML中 video标签样式铺满全屏

video标签默认不是铺满的&#xff0c;即使手动设置宽高100%也不会生效&#xff0c;所以当需要video铺满div时&#xff0c;需要加上一个css样式 <videocontrolsstyle"width: 100%; height: 100%; object-fit: fill"autoplay:src"item.video" ></v…...

vue项目移动端商场

一、项目前端页面展示 二、项目整体目录结构 三、项目流程 1. vue快速创建基础项目 创建项目 vue create hk-shop 1 选择需要的配置 创建基础文件夹目录 src文件夹下文件夹目录&#xff1a; ① views 文件夹存放界面 ② components 文件夹存放界面中局部组件 ③ config 文件夹存…...

Golang | Leetcode Golang题解之第97题交错字符串

题目&#xff1a; 题解&#xff1a; func isInterleave(s1 string, s2 string, s3 string) bool {n, m, t : len(s1), len(s2), len(s3)if (n m) ! t {return false}f : make([]bool, m 1)f[0] truefor i : 0; i < n; i {for j : 0; j < m; j {p : i j - 1if i >…...

2024电工杯B题:大学生平衡膳食食谱的优化设计及评价

问题重述 大学时代是学知识长身体的重要阶段&#xff0c;同时也是良好饮食习惯形成的重要时期。这一特定年龄段的年轻人&#xff0c;不仅身体发育需要有充足的能量和各种营养素&#xff0c;而且繁重的脑力劳动和较大量的体育锻炼也需要消耗大量的能源物质。大学生中饮食结构不…...

齐护K210系列教程(三十二)_在线模型训练

在线模型训练 概念理解准备工作1 采集图像1.1 图像要求1.2 使用K210采集图片 2 标注图像3 打包数据集4 上传数据4.1创建项目4.1.1图像分类创建项目4.1.2图像检测创建项目 4.2上传数据4.2.1分类检测上传数据4.2.2图像检测上传数据 5 训练模型6 部署模型以及测试7 测试效果7.1图像…...

碌时刻必备!微信自动回复让你告别消息堆积

在忙碌的时候&#xff0c;我们往往会面临消息堆积如山的情况。无法及时回复消息不仅容易造成交流障碍&#xff0c;还可能错过重要的机会。 但是现在&#xff0c;有一个神奇的工具——个微管理系统&#xff0c;可以帮助我们轻松应对这个问题 &#xff0c;实现微信自动回复。 首…...

【ARM 裸机】按键输入

本节学习按键输入&#xff0c;先拷贝上一节工程文件&#xff0c; 1、驱动编写 新建 key 的 .h 和 .c 文件&#xff1b; 再查看一下硬件原理图如下&#xff1b; 由此可知&#xff0c;KEY0 按键接在 UART1_CTS 引脚上&#xff0c;默认情况下为高电平&#xff0c;按键按下为…...

站在ESG“20+”新起点上,看中国ESG先锋探索力量

全链减碳、建设绿色工厂、打造零碳产品、守护生物多样性、向受灾群众捐助……不知你是否察觉&#xff0c;自“双碳”目标提出以来&#xff0c;一股“可持续发展热潮”正覆盖各行各业&#xff0c;并且渗透到我们衣食住行的方方面面。在资本市场&#xff0c;ESG投资热潮更是席卷全…...

【CTF Web】CTFShow web4 Writeup(SQL注入+PHP+字符型注入)

web4 1 管理员阿呆又失败了&#xff0c;这次一定要堵住漏洞 解法 注意到&#xff1a; <!-- flag in id 1000 -->拦截很多种字符&#xff0c;连 select 也不给用了。 if(preg_match("/or|\-|\\\|\/|\\*|\<|\>|\!|x|hex|\(|\)|\|select/i",$id)){die(&q…...

软件设计师备考 | 案例专题之数据库设计 概念与例题

相关概念 关注上图中的两个部分&#xff1a; 概念结构设计 设计E-R图&#xff0c;也即实体-联系图。 工作步骤&#xff1a;选择局部应用、逐一设计分E-R图、E-R图合并。进行合并时&#xff0c;它们之间存在的冲突主要有以下3类&#xff1a; 属性冲突。同一属性可能会存在于…...

【全网最全】2024电工杯数学建模A题成品论文+前三题完整解答matlab+py代码等(后续会更新成品论文)

您的点赞收藏是我继续更新的最大动力&#xff01; 一定要点击如下的卡片链接&#xff0c;那是获取资料的入口&#xff01; 【全网最全】2024电工杯数学建模A题成品论文前三题完整解答matlabpy代码等&#xff08;后续会更新成品论文&#xff09;「首先来看看目前已有的资料&am…...

基于.net开发的博客系统

基于.net开发可以批量上传md文件生成文章的博客系统 .NET 个人博客 基于.net开发的博客系统 个人博客系统&#xff0c;采用.net core微服务技术搭建&#xff0c;采用传统的MVC模式&#xff0c;使用EF core来对mysql数据库(sqlite数据库)进行CRUD操作项目 为什么要自己开发博客…...

python给图片加上图片水印

python给图片加上图片水印 作用效果代码 作用 给图片加上图片水印图片水印的透明度&#xff0c;位置可自定义 效果 原始图片&#xff1a; 水印图片&#xff1a; 添加水印后的图片&#xff1a; 代码 from PIL import Image, ImageDraw, ImageFontdef add_watermark(in…...