跨域和http协议

HTTP的请求只能是客户端向服务器发起。

第一步：建立连接（三次握手）

第二步：开始通信

通信中又分为客户端对服务器请求

请求要遵循请求报文的要求

请求报文：

请求行：请求方式/请求路径/协议版本

POST /user HTTP/1.1
# POST 请求方式
# /user 请求URL（不包含域名）
# HTTP/1.1 请求协议版本

请求头：键值对

user-agent: Mozilla/5.0 # 产生请求的浏览器信息
accept: application/json # 表示客户端希望接受的数据类型
Content-Type: application/x-www-form-urlencoded # 客户端发送的实体数据格式
Host: 127.0.0.1 # 请求的主机名（IP）

请求空行：空格换行

请求主体：请求携带的数据

    post请求：Form Data

    get请求：Query String Parameters

    全是：键=值&键=值

# GET 请求是没有请求体数据的

# POST 请求才有请求体数据

 响应要遵循响应报文的要求

响应行：协议版本/状态码/状态描述

    状态码：

        1开头 - 正在请求中

        2开头 - 各种成功

            200 ok

        3开头 - 缓存/跳转 相关

            304 缓存

        4开头 - 客户端有错误

            403 没有权限

            404 url写错了

        5开头 - 服务器有错误

            500 服务器内部错误

响应头：

响应主体：单独在response中，可以有preview提前查看好看的格式

第三步：断开连接

跨域问题：

浏览器为了安全 - 同源策略

 同源策略：ajax请求，只能请求到同源的服务器

 我的网址地址：   http://1.2.3.4/index.html - http://1.2.3.4/data.json

 同源：协议相同且端口号相同且域名相同

 有些默认端口号，浏览器会省略；http协议，默认使用80端口，https默认使用443端口

 浏览器碰到ajax在访问不同源的地址，就会报错 - 目标上没有  header

 访问不同源的地址 - 跨域

 1.jsonp跨域：利用标签属性，发送请求的时候不需要考虑同源策略

 使用get请求：

①输入网址敲回车

②a标签跳转

③form默认提交

④location.href

⑤link标签引入css文件

⑥script引入js - script会把请求回来的内容当做js代码解析

⑦img引入图片

⑧iframe标签引入别的网页

 2.cors跨域：同源策略报错的时候，提示 在目标源文件中没有一个 "" header 

 给目标源文件中设置允许跨域的header就好了

 允许跨域的响应头 ---  Access-Control-Allow-Origin:*

 3.proxy跨域：利用服务器做代理

 打开文件就使用服务器环境打开，可以配置自己的服务器，代替ajax请求到不同源的地址

 浏览器只是客户端，限制不了服务器

4.

1.安装phpstudy - 安装目录中不能有空格和中文

2.打开安装目录中的 D:\phpStudy\PHPTutorial\nginx\conf\nginx.conf文件

    在83行添加一下配置：

    location 自定义地址 {

        proxy_pass  目标地址;

    }

    location /abcd {

        proxy_pass  https://www.duitang.com/napi/blog/list/by_filter_id/;

    }

3.重新启动服务器

4.自己在 D:\phpStudy\PHPTutorial\WWW 将这个文件中的所有文件全部删除，然后在里面写一个html文件

    在文件中给自己服务器刚刚定义好的自定义地址发送请求，服务器就会帮我们代理请求到目标服务器

5.打开自己文件： http://localhost/写的文件名称