Django使用中間件解決前后端同源策略問題
問題描述
前端時(shí)間在公司的時(shí)候，要使用angular開發(fā)一個(gè)網(wǎng)站，因?yàn)閍ngular很適合前后端分離，所以就做了一個(gè)簡單的圖書管理系統(tǒng)來模擬前后端分離。
但是在開發(fā)過程中遇見了同源策略的跨域問題，頁面能夠顯示，但是卻沒有數(shù)據(jù)，顯示如下
右鍵檢查報(bào)錯(cuò)如下：
報(bào)錯(cuò)代碼如下
Failed to load http://127.0.0.1:8888/publisher/: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access.
angular從后端獲取數(shù)據(jù)的代碼如下：
private publishersUrl = 'http://127.0.0.1:8888/publisher/';
private addpubUrl = 'http://127.0.0.1:8888/addpub/';
getPublishers (): Observable<Publisher[]> {
return this.http.get<Publisher[]>(this.publishersUrl)
.pipe(
catchError(this.handleError<Publisher[]>('getPublishers', []))
);
}
問題原因
出現(xiàn)這個(gè)問題的原因是同源策略的跨域問題，關(guān)于這個(gè)問題不在此處詳細(xì)討論，如有興趣可以去搜索一下。
問題解決
解決這個(gè)問題關(guān)鍵在于后端，要允許其他網(wǎng)站進(jìn)行訪問，在這里我們可以定義一個(gè)中間件來解決這個(gè)問題，步驟如下。
1.在app下新建一個(gè)myMiddleware.py文件。
2.在文件中加入以下代碼
from django.utils.deprecation import MiddlewareMixin
class MyCore(MiddlewareMixin):
def process_response(self, request, response):
response['Access-Control-Allow-Origin'] = "*"
if request.method == "OPTIONS":
# 復(fù)雜請求 預(yù)檢
response['Access-Control-Allow-Headers'] = "Content-Type"
response['Access-Control-Allow-Methods'] = "POST, DELETE, PUT"
return response
3.去settings文件中注冊中間件
MIDDLEWARE = [ 'BMS.myMiddleware.MyCore', ]
至此，這個(gè)問題就算解決了，我們可以將項(xiàng)目運(yùn)行起來看一下結(jié)果
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
python+selenium 點(diǎn)擊單選框-radio的實(shí)現(xiàn)方法
今天小編就為大家分享一篇python+selenium 點(diǎn)擊單選框-radio的實(shí)現(xiàn)方法，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
python使用MQTT給硬件傳輸圖片的實(shí)現(xiàn)方法
最近因需要用python寫一個(gè)微服務(wù)來用MQTT給硬件傳輸圖片，其中python用的是flask框架。這篇文章主要介紹了python使用MQTT給硬件傳輸圖片,需要的朋友可以參考下2019-05-05
python中exec函數(shù)的實(shí)現(xiàn)
exec()是Python內(nèi)置的一個(gè)函數(shù),用于在運(yùn)行時(shí)執(zhí)行動(dòng)態(tài)生成的Python代碼,下面就來介紹一下python中exec函數(shù)的實(shí)現(xiàn),具有一定的參考價(jià)值,感興趣的可以了解一下2023-10-10
Ubuntu 16.04 LTS中源碼安裝Python 3.6.0的方法教程
最近Python 3發(fā)布了新版本Python 3.6.0，好像又加入了不少黑魔法！由于暫時(shí)不能使用 apt-get 的方式安裝 Python 3.6，所以還是直接編譯源碼安裝吧。下面這篇文章就介紹了在Ubuntu 16.04 LTS中源碼安裝Python 3.6.0的方法教程,需要的朋友可以參考下。2016-12-12
這篇文章主要介紹了如何使用Canny算法檢測出紙面上硬幣的邊緣。文中的示例代碼講解詳細(xì)，感興趣的小伙伴可以跟隨小編一起動(dòng)手試一試2022-01-01
Python爬蟲實(shí)現(xiàn)獲取動(dòng)態(tài)gif格式搞笑圖片的方法示例
這篇文章主要介紹了Python爬蟲實(shí)現(xiàn)獲取動(dòng)態(tài)gif格式搞笑圖片的方法,結(jié)合實(shí)例形式分析了Python針對gif格式圖片的爬取、下載等相關(guān)操作技巧,需要的朋友可以參考下2018-12-12
python基于socket實(shí)現(xiàn)網(wǎng)絡(luò)廣播的方法
這篇文章主要介紹了python基于socket實(shí)現(xiàn)網(wǎng)絡(luò)廣播的方法,涉及Python操作socket的相關(guān)技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-04-04
Python實(shí)現(xiàn)的邏輯回歸算法示例【附測試csv文件下載】
這篇文章主要介紹了Python實(shí)現(xiàn)的邏輯回歸算法,結(jié)合具體實(shí)例形式分析了Python邏輯回歸算法相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2018-12-12
這篇文章主要介紹了python實(shí)現(xiàn)括號匹配及匹配格式的相關(guān)知識(shí)，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-08-08
python 使用poster模塊進(jìn)行http方式的文件傳輸?shù)椒?wù)器的方法
今天小編就為大家分享一篇python 使用poster模塊進(jìn)行http方式的文件傳輸?shù)椒?wù)器的方法，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-01-01