前言
若後端採用django,前端打算選用框架來開發,不必自己辛苦融合
在github上可以找到已經處理好的,只要下載就可以開始project
以我熟悉的vue為例,在github上試了幾個,最後找到tmpbook/django-with-vuejs比較符合個人的規畫,而且又有中文說明XD (詳見參考資料)
試著練習開發時發現一個問題:django執行時有一個port,vue開發時也有一個port。寫get時還無妨,寫到post時就遇上跨網域存取禁止的問題
一開始傻傻的,一直build成結果檔,在從django的服務上測試
每build一次就要十來秒啊!邊開發邊debug時,超級痛苦!時間都浪費在等待上了…
後來再回去看說明,才發現文章中間有寫到開發過程中的跨域存取問題。真的是要乖乖看完readme再開始作業的QQ
以下作業幾乎就是照抄原文了
我想同樣都是初學者但用其他框架應該也有可能遇到一樣的問題
所以還是把這一塊單獨拉出來寫成一篇了
至少讓其他跟我一樣剛入門的可以少走一些歪路
要安裝django的三方套件:django-cors-headers來解決
作法
安裝套件
1
pip install django-cors-headers
在setting.py中的MIDDLEWARE片段引用(注意,列表有順序性)
1 | MIDDLEWARE = [ |
- 一樣在setting.py,後方新增
1
CORS_ORIGIN_ALLOW_ALL = True # 開發完成要部署的話,記得改成False唷
浪費我一下午無盡try and error的build後,才發現的答案…-_-