HTTP响应

news2024/12/28 7:18:42

HTTP响应分为四个部分：

首行：HTTP/1.1（首行） 200（状态码） OK（状态码描述）
header：
空行：表示header的结束标记
body：正文

HTTP状态码：描述了这次响应的结果（成功？？失败？？原因是啥？？

200：OK：成功了
404：NOT FOUND：访问资源不存在——》在服务器中没找到
403：FORBIDDEN：访问被拒绝（没有权限）
302：Move trmporarily：重定向（类似于呼叫转换）

教务系统申请个域名，过了一段时间，要换个域名，若换了域名，那么，老学员咋整？？可以配置个重定向，如果老学员访问旧域名，则自带跳转到新的域名

302这样的响应报文中，会在header里带有个location属性，通过这个属性来描述要跳转到哪个新的地址？？

所谓的重定向是指：可以重定向到外部资源的（跳转到别的网站）

下面我们来看一个图，来了解一下重定向与请求转发之间的区别？？

505：服务器内部错误（服务器代码抛异常了）
gateway timeout（响应时间太久了，浏览器等不了了）

其实，这么多状态码，可以分为几个大类的：

2**：成功
3**：重定向
4**：客户端错误
5**：服务器错误

HTTP协议里，有不少地方是程序员可以自定义的！！

URL中的路径
URL中的query string
header中的键值对
header中的cookie的键值对
body

学习HTTP很好的办法，就是写爬虫，写一个程序，作为HTTP客户端，构造各种HTTP请求，通过这些请求，来获取你想要的一些效果~~，当然，爬虫犯法，轻易不做！！

那么，我们如何来构造一个HTTP请求呢？？（代码）

对于GET/POST请求，我们可以通过form标签来进行构造，这也是比较常见/重要的前后端交互的方式！

对于GET请求，可以通过在form标签中设置method属性为"get"来构造HTTP请求。例如：
<body>
    <form action="https://sogou.com" method="get">
        <input type="text" name="key" value="value">
        <input type="submit" value="提交">
      </form>      
</body>
在这个例子中，当用户点击提交按钮时，浏览器会发送一个GET请求到"https://sogou.com"。
根据结果，我们可以看到，这个请求，搜狗的服务器没有做啥特别的处理，仍然是普普通通的返回搜狗的主页了！！

当然，在后续咱们自己写的服务器代码，就可以根据需要，来获取URL中的query string ，从而完成不同的功能！！

form标签只能构造GET和POST，无法构造PUT，DELETE，OPTIONS等方法的请求！！

另外还有一种功能更强大的，构造http请求的方式，Ajax（读法：阿加克斯）

Ajax也是浏览器提供的一种，通过js构造http请求的方式！！

a——》异步的！asynchronize

同步的等待：我一直死死盯着女神宿舍门口，等待对象一露头，就立马扑上去！
异步的等待：我找个阴凉地方坐下，并拿出一本Java书，读得津津有味，等到对象出来以后，她再来喊我~~

综上：A等待B

同步：A始终盯着B，A负责关注B啥时候就绪
异步：A不盯着B，B就绪之后主动通知A

HTML中，通过Ajax的方式发起HTTP请求，就属于“异步”的方式！

这一行代码执行“发送请求”，操作之后，不必等待服务器响应回来，就可以立即先往下执行，当服务器的响应回来了之后，再由浏览器通知到咱们的代码中！

那么，在代码中，如何使用Ajax呢？？

js原生提供了Ajax的api，但是原生api特别难用！！
jquery提供的Ajax，api针对原生api的封装，简单很多！！

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- <form action="https://sogou.com" method="get">
        <input type="text" name="key" value="value">
        <input type="submit" value="提交">
      </form>       -->
      <!-- 引入jquery -->
      <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
      <script>
            $.ajax({
   
    type: "GET",
    url: "https://www.sogou.com?studentName=zhangsan",
    success: function(data) {
        console.log("当服务器返回的响应达到浏览器之后，浏览器触发该回调，通知到咱们的代码中");
    },
    error: function(jqXHR, textStatus, errorThrown) {
        console.log("请求失败，错误信息：", textStatus, errorThrown);
    }
    });
    console.log("浏览器立即往下，执行后续代码");

      </script>
</body>
</html>

注意：该代码直接执行，只能看到构造的请求，无法获取到正确的响应，因为，发送请求给搜狗的服务器，人家的服务器没有处理咱们的响应，等后面咱们自己能写服务器了之后，就可以给咱们自己的服务器发请求，自然就能够处理了！！