B-S模式:

browser------>server

BS模式工作过程:

用户在 browser 输入一个URL 确定要访问的server

browser发送 post/get请求 给server端

server端 响应html网页代码 给browser

browser渲染网页代码效果呈现给用户

一、http协议是什么?

超文本传输协议:HTTP(hypertext transport protocol),即超文本传输协议。这个协议详细规定了浏览器和万维网服务器之间互相传输数据的规则。

HTTP就是一个通信规则,通信规则规定了客户端发送给服务器的内容格式,也规定了服务器发送给客户端的内容格式。其实我们要学习的就是这个两个格式!

超文本传输协议的分类:

客户端发送给服务器的格式叫“请求协议”;

服务器发送给客户端的格式叫“响应协议”。

特点:

  • HTTP叫超文本传输协议,基于请求/响应模式的!
  • HTTP是无状态协议。()

请求协议:浏览器访问服务器时遵循的规则

1、GET请求

HTTP默认的请求方法就是GET
     * 没有请求体
     * 数据必须在1K之内!
     * GET请求数据会暴露在浏览器的地址栏中

GET请求常用的操作:
       1. 在浏览器的地址栏中直接给出URL,那么就一定是GET请求
       2. 点击页面上的超链接也一定是GET请求
       3. 提交表单时,表单默认使用GET请求,但可以设置为POST

html:是通信时数据传输格式

由于http的特性时无状态的,所以每次请求时客户端携带cokie去访问服务端

cokie 把会话信息全部保存在客户端

session:是把会话信息放在服务端,客户端保存会话ID,通过会话ID去服务器打开自己的会话信息;

2、post

(1). 数据不会出现在地址栏中
(2). 数据的大小没有上限
(3). 有请求体
(4). 请求体中如果存在中文,会使用URL编码!

响应协议:服务器响应客户端时遵循的标准

响应首行;
响应头信息;
空行;
响应体。

响应状态码

  • 200:请求成功,浏览器会把响应体内容(通常是html)显示在浏览器中;
  • 404:请求的资源没有找到,说明客户端错误的请求了不存在的资源;
  • 500:请求资源找到了,但服务器内部出现了错误;
  • 302:重定向,当响应码为302时,表示服务器要求浏览器重新再发一个请求,服务器会发送一个响应头Location,它指定了新请求的URL地址;
  • 304:缓存未过期,继续去获取缓存资源。
  • 当用户第一次请求index.html时,服务器会添加一个名为Last-Modified响应头,这个头说明了
    index.html的最后修改时间,浏览器会把index.html内容,以及最后响应时间缓存下来。当用户第
    二次请求index.html时,在请求中包含一个名为If-Modified-Since请求头,它的值就是第一次请
    求时服务器通过Last-Modified响应头发送给浏览器的值,即index.html最后的修改时间,
    If-Modified-Since请求头就是在告诉服务器,我这里浏览器缓存的index.html最后修改时间是这个,
    您看看现在的index.html最后修改时间是不是这个,如果还是,那么您就不用再响应这个index.html
    内容了,我会把缓存的内容直接显示出来。而服务器端会获取If-Modified-Since值,与index.html
    的当前最后修改时间比对,如果相同,服务器会发响应码304,表示index.html与浏览器上次缓存的相
    同,无需再次发送,浏览器可以显示自己的缓存页面,如果比对不同,那么说明index.html已经做了修
    改,服务器会响应200。

前端基础之http协议的更多相关文章

  1. 前端基础(http协议相关篇)

    网络协议篇: 1.http请求过程 DNS解析——tcp三次握手——建立tcp连接后发起http请求——服务器响应http请求 ——浏览器得到资源——浏览器渲染 2.http报文 通用首部:可以出现在 ...

  2. 前端基础:HTTP 协议详解

    参考:https://kb.cnblogs.com/page/130970/#httpmeessagestructe HTTP协议是无状态的 http协议是无状态的,同一个客户端的这次请求和上次请求是 ...

  3. 前端基础面试题(JS部分)

    1.几种基本数据类型?复杂数据类型?值类型和引用数据类型?堆栈数据结构? 基本数据类型:Undefined.Null.Boolean.Number.String 值类型:数值.布尔值.null.und ...

  4. 前端基础:HTML标签(下)

    前端基础HTML标签(下) 1.表单 表单的功能主要用于向服务器传输数据,从而实现客户端与Web服务器的交互.表单能够包含input系列标签,比如:文本字段.复选框.单选按钮.提交按钮等:表单还包含t ...

  5. day--42 前端基础小结

    前端基础总结 一:前端实现的原理: 小实例: 01:第一步:创建一个socket服务端: import socket server=socket.socket() ip_port=("127 ...

  6. BAT 前端开发面经 —— 吐血总结 前端相关片段整理——持续更新 前端基础精简总结 Web Storage You don't know js

    BAT 前端开发面经 —— 吐血总结   目录 1. Tencent 2. 阿里 3. 百度 更好阅读,请移步这里 聊之前 最近暑期实习招聘已经开始,个人目前参加了阿里的内推及腾讯和百度的实习生招聘, ...

  7. 前端第一篇---前端基础之HTML内容

    前端基础之HTML内容 阅读目录(Content) 一.HTML初识 1.web服务本质 2.HTML是什么 3.HTML不是什么 二.HTML文档结构 三.HTML标签格式 四.HTML注释 五.H ...

  8. 前端第三篇---前端基础之JavaScript

    前端第三篇---前端基础之JavaScript 一.JavaScript概述 二.JavaScript的基础 三.词法分析 四.JavaScript的内置对象和方法 五.BOM对象 六.DOM对象 七 ...

  9. 前端基础面试题(js部分)

      前端基础面试题(JS部分)   1.几种基本数据类型?复杂数据类型?值类型和引用数据类型?堆栈数据结构? 基本数据类型:Undefined.Null.Boolean.Number.String值类 ...

随机推荐

  1. 集成算法——Ensemble learning

    目的:让机器学习效果更好,单个不行,群殴啊! Bagging:训练多个分类器取平均 Boosting:从弱学习器开始加强,通过加权来进行训练 (加入一棵树,比原来要强) Stacking:聚合多个分类 ...

  2. python基础实践 -python是一门动态解释性的强类型定义语言

    python是一门动态解释性的强类型定义语言 Python能做什么? Python是一门综合性的语言,你几乎能在计算机上通过Python做任何事情,以下是Python应该最广泛的几个方面: 1.网络应 ...

  3. 针对list集合进行分页展示

    直接定义个工具类,代码如下: package com.jk51.modules.wechat.web.util; import java.util.Collections; import java.u ...

  4. MVC杂记

    @{ Layout = “…”} To define layout page Equivalent to asp.NET master-page 要定义相当于ASP.Net母版页的页面布局 @mode ...

  5. _pvp_killed_loot

    该表控制玩家被击杀时掉落物品,包括角色身上装备,背包物品,银行物品 comment 备注 entry 掉落的物品ID lootCount 掉落的物品数量 chance 掉落的几率,例如50,则50%几 ...

  6. 为 10000+ 业务系统提供数据可视化能力的 AntV 又进化了

    小蚂蚁说: 2018 年 AntV 品牌日以知新.知心为主题,旨在让产品一直「知新」,与用户一直「知心」.AntV 是蚂蚁金服全新一代数据可视化解决方案,致力于提供一套简单方便.专业可靠.无限可能的数 ...

  7. Linux chpasswd (批量或单一修改用户密码)和passwd(直接修改用户密码)

    Linux命令:chpasswd 批量或者单一修改用户密码 语法: 1:# echo 用户名:密码 | chpasswd 2:# chpasswd < doiido.txt 实例 1.直接修改d ...

  8. centos 安装 FLEXPART

    师哥做了个课题,用FLEXPART分析大气伴飞轨迹,提前先安装这个软件吧.我使用的环境是centos7,看官慢慢看,结尾有彩蛋~ 准备工作,flexpart是用Fortran语言写的,以.90结尾的文 ...

  9. Spring Boot入门第一天:Hello, Spring Boot!

    原文链接 1. 新建一个Maven Web项目. 2. 配置pom.xml文件. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 ...

  10. word中的交叉引用

    分别使用“交叉引用”依次插入所需应用文献编号范围的第一个和最后一个. 所需引用处出现“[1][3]”   在引用处对两个编号操作:点击鼠标右键-选择“切换域代码”. [1]变为” {REF _Ref4 ...