[Javascript] 跨domain取存網頁資料的問題

本來想先在heroku上先佈署好app，有了web-api後就可以在local端寫web的code比較不用改一點就上傳，一直在等…

結果出現了錯誤如下：(後來為了求快，因此改在local端執行我的flask程式，因此會看到127.0.0.1)

XMLHttpRequest cannot load http://127.0.0.1:5000/get_meeting_room_data. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

1.先使用flask-crossdomain：

參考這邊

http://flask.pocoo.org/snippets/56/

先安裝這個

https://pypi.python.org/pypi/flask-crossdomain/0.1

在程式開頭加入

import flask_crossdomain

然後在需要被存取的web服務加入

@crossdomain(origin='*')

比如說：

@app.route('/get_meeting_room_data2')

#@crossdomain(origin='*')

def get_meeting_room_data2():

    ......

但是出現了以下的錯誤：

Traceback (most recent call last):

 File "E:\workspace\python\flask\flask_step2_local\app.py", line 103, in <module>

   @crossdomain(origin='*')

NameError: name 'crossdomain' is not defined

仍有問題 --> 還要再了解看看是哪兒出了錯

2. 後來改用「Flask-CORS」就正常了

https://flask-cors.readthedocs.io/en/latest/
先安裝
pip install -U flask-cors
在程式中加入以下即可：
from flask_cors import CORS, cross_origin

app = Flask(__name__) CORS(app)

三行就搞定收工了!

非常方便

在javascript的部份則如下
function getData3() { $.get( "http://127.0.0.1:5001/get_meeting_room_data", function( data ) { var json_obj = $.parseJSON(data); } }); }