HTTP和CORS跨域

HTTP包括http請求和http響應

http請求包括：

• 請求行（請求方法 URL HTTP/版本號， 好比：GET http://m.baidu.com/ HTTP/1.1，get請求的參數會直接追加在url上，而post請求的參數是存在請求體中）
• 請求頭
• 請求體

請求頭中Content-Type的值常見的有application/x-www-form-urlencoded和application/json。

瀏覽器的原生<form>表單，若是不設置enctype屬性，那麼最終就會以application/x-www-form-urlencoded方式提交數據，提交的數據按照 key1=val1&key2=val2的方式進行編碼，key和val都進行了URL轉碼：

POST http://www.example.com HTTP/1.1
Content-Type: application/x-www-form-urlencoded;charset=utf-8

title=test&sub%5B%5D=1&sub%5B%5D=2&sub%5B%5D=3

application/json post參數以json的形式傳送

POST http://www.example.com HTTP/1.1
Content-Type: application/json;charset=utf-8

{"title":"test","sub":[1,2,3]}

http響應包括：

• 狀態行（HTTP/版本號 返回碼 返回碼描述, 好比：HTTP/1.1 200 OK）
• 消息頭（Content-Encoding用做媒體類型的修飾符，好比Content-Encoding：gzip。Content-Type指明發送給接收者的實體正文的媒體類型。Expires實體報頭域給出響應過時的日期和時間。）
• 消息體（服務器返回的資源的內容，多是html，也多是json數據）

cors跨域

跨域的方案有不少種，看了阮一峯的關於cors文章，對cors有了理解，cors跨域主要是要在服務端進行設置，以koa爲例

import Koa from 'koa'
import cors from 'koa2-cors'

cosnt app = new Koa()

app.use(cors({
    maxAge: 5,
    credentials: true, // 發送cookie
    origin: 'http://localhost:8080',
    allowMethods: ['GET', 'POST', 'DELETE'],
    allowHeaders: ['Content-Type', 'Authorization', 'Accept'],
    exposeHeaders: ['WWW-Authenticate', 'Server-Authorization']
}))

app.use((ctx, next) => {
  ctx.body = 'hello'
})

app.listen(3000)

前端用axios，須要設置一下cookie

axios.defaults.withCredentials = true  // axios請求攜帶cookie

這樣就OK了。