【content-type, webSocket, cookie】【跨域-cross-options】【编码方式】

目录

HTTP相关

1. websocket

2. content-type

3. HTTP方法中的options方法

4. cookie

编码方式

关于跨域

1. cors (access control allow origin)&(options)

2. 代码中配置CORS

3. JSONP

---

HTTP相关

1. websocket

WebSocket和HTTP都是基于TCP协议的两个不同的协议，WebSocket依赖于HTTP连接

每个WebSocket连接都始于一个HTTP请求。具体来说，WebSocket协议在第一次握手连接时，通过HTTP协议在传送WebSocket支持的版本号，协议的字版本号，原始地址，主机地址等等一些列字段给服务器端：

GET /chat HTTP/1.1

Host: server.example.com

Upgrade: websocket

Connection: Upgrade

Sec-WebSocket-Key:dGhlIHNhbXBsZSBub25jZQ==

Origin: http://example.com

Sec-WebSocket-Version: 13

如果服务器支持新的协议，则必须返回101：

HTTP/1.1 101 Switching Protocols

Upgrade: websocket

Connection: Upgrade

Sec-WebSocket-Accept:s3pPLMBiTxaQ9kYGzzhZRbK+xOo=

至此，HTTP请求物尽其用，如果成功出发onopen事件，否则触发onerror事件，后面的传输则不再依赖HTTP协议。

2. content-type

对于一些复制的数据对象，对象里面再嵌套数组的话，建议使用application/json传递比较好，开发那边也会要求使用application/json。

通过json的形式将数据发送给服务器。json的形式的优点是它可以传递结构复杂的数据形式，比如对象里面嵌套数组这样的形式等。

Content-Type是指http/https发送信息至服务器时的内容编码类型，contentType用于表明发送数据流的类型，服务器根据编码类型使用特定的解析方式，获取数据流中的数据。

Content-Type 实体头部用于指示资源的MIME类型 media type 。在响应中，Content-Type标头告诉客户端实际返回的内容的内容类型。

3. HTTP方法中的options方法

客户端向服务端询问支持的方法

4. cookie

4.1 简介：

cookie可以用来告知服务端2个请求是否来自于同一个浏览器，如保持用户登录状态。cookie使得无状态的http协议可以记录状态。

4.2 如何工作：

当浏览器向服务器进行请求的时候，服务器会使用Set-Cookie响应头部向浏览器发送信息：

HTTP/1.0 200 OK

Content-type: text/html

Set-Cookie: yummy_cookie=choco

Set-Cookie: tasty_cookie=strawberry

然后对该服务器再次发起请求，浏览器都会将之前保存的cookie通过Cookie请求头部再次发送给服务器：

GET /sample_page.html HTTP/1.1

Host: www.example.org

Cookie: yummy_cookie=choco; tasty_cookie=strawberry

---

编码方式

UTF-8是UTF-8编码是一种目前广泛应用于网页的编码，它其实是一种Unicode编码，即致力于把全球所有语言纳入一个统一的编码。

charset 是编码的意思，  charset有很多类型，gb2312和 utf-8就是其中两种常见的编码。gb2312是中文的，utf-8是通用的。

---

关于跨域

1. cors (access control allow origin)&(options)

 前台跨域post请求，由于CORS（cross origin resource share）规范的存在，浏览器会首先发送一次options嗅探，同时header带上origin，判断是否有跨域请求权限，服务器响应access control allow origin的值，供浏览器与origin匹配，如果匹配则正式发送post请求。

分为简单请求和非简单请求，只有在非简单请求中才会发送预检请求。（待补充。。）

如果有服务器程序权限，设置，比如jsp中，设置header access control allow origin等于*，就可以得到跨域访问的目的。

预检请求（option）:在 CORS 中，可以使用 OPTIONS 方法发起一个预检请求(一般都是浏览检测到请求跨域时，会自动发起)，以检测实际请求是否可以被服务器所接受。预检请求报文中的 Access-Control-Request-Method 首部字段告知服务器实际请求所使用的 HTTP 方法；Access-Control-Request-Headers 首部字段告知服务器实际请求所携带的自定义首部字段。服务器基于从预检请求获得的信息来判断，是否接受接下来的实际请求。

服务器所返回的 Access-Control-Allow-Methods 首部字段将所有允许的请求方法告知客户端。

2. 代码中配置CORS

1. 普通跨域请求，只需服务器设置：access-control-allow-origin
2. 带cookie的跨域请求，前后端都要进行设置

下面附上java服务器端设置的代码：

/*
 * 导入包：import javax.servlet.http.HttpServletResponse;
 * 接口参数中定义：HttpServletResponse response
 */
 
// 允许跨域访问的域名：若有端口需写全（协议+域名+端口），若没有端口末尾不用加'/'
response.setHeader("Access-Control-Allow-Origin", "http://www.domain1.com"); 
 
// 允许前端带认证cookie：启用此项后，上面的域名不能为'*'，必须指定具体的域名，否则浏览器会提示
response.setHeader("Access-Control-Allow-Credentials", "true"); 
 
// 提示OPTIONS预检时，后端需要设置的两个常用自定义头
response.setHeader("Access-Control-Allow-Headers", "Content-Type,X-Requested-With");

3. JSONP

还有一种跨域方式称为JSONP，它有个限制，只能用GET请求，并且要求返回JavaScript。这种方式跨域实际上是利用了浏览器允许跨域引用JavaScript资源：    <script src="http://example.com/abc.js"></script>。好处是兼容性好，兼容低版本的IE。

---

马克：

IPV4 IPV6