解決Flask跨域問題的幾種方式

1.問題描述

當客戶端向服務器端請求ajax服務時，如果客戶端和服務器端域名不一致，就會出現跨域問題，ajax報錯：No 'Access-Control-Allow-Origin' header is present on the requested 。

2.解決方式：

（1）安裝flask_cors：

pip install flask_cors

app初始化的時候就加載配置，如下

from flask import Flask
from flask_cors import CORS
app = Flask(__name__)
# r'/*' 是通配符，讓本服務器所有的 URL 都允許跨域請求
CORS(app, resources=r'/*')
if __name__ == "__main__":
    app.run()

CORS參數說明

參數	類型	Head字段	說明
resources	字典、迭代器或字符串	無	全局配置允許跨域的API接口
origins	列表、字符串或正則表達式	Access-Control-Allow-Origin	配置允許跨域訪問的源， *表示全部允許
methods	列表、字符串	Access-Control-Allow-Methods	配置跨域支持的請求方式， 如：GET、POST
expose_headers	列表、字符串	Access-Control-Expose-Headers	自定義請求響應的Head信息
allow_headers	列表、字符串或正則表達式	Access-Control-Request-Headers	配置允許跨域的請求頭
supports_credentials	布爾值	Access-Control-Allow-Credentials	是否允許請求發送cookie， false是不允許
max_age	整數、字符串	Access-Control-Max-Age	預檢請求的有效時長

（2）在被請求的Response header中加入header

@app.after_request
def func_res(resp):     
    res = make_response(resp)
    res.headers['Access-Control-Allow-Origin'] = '*'
    res.headers['Access-Control-Allow-Methods'] = 'GET,POST'
    res.headers['Access-Control-Allow-Headers'] = 'x-requested-with,content-type'
    return res

（3）改成jsonp格式（不推薦）

在ajax請求裏將數據類型改成jsonp，但是在返回數據的時候需要一個回調函數讀取，而且jsonp只支持get方式，即使使用post方式，在調用的時候也會變成get方式，這帶來安全性上的問題，並不推薦。

$.ajax({
        type:'POST',
        url:'127.0.0.1：5000',
        data:data,
        dataType:'jsonp',//改成了jsonp格式，解決了跨域訪問的問題
        success:function(data){
            console.log(data)
        }