Flask RESTful cross-domain issue with Angular: PUT, OPTIONS methods

Question

I've developed a small write-only REST api with Flask Restful that accepts PUT request from a handful of clients that can potentially have changing IP addresses. My clients are embedded Chromium clients running an AngularJS front-end; they authenticate with my API with a simple magic key -- it's sufficient for my very limited scale.

I'm testing deploying my API now and I notice that the Angular clients are attempting to send an OPTIONS http methods to my Flask service. My API meanwhile is replying with a 404 (since I didn't write an OPTIONS handler yet, only a PUT handler). It seems that when sending cross-domain requests that are not POST or GET, Angular will send a pre-flight OPTIONS method at the server to make sure the cross-domain request is accepted before it sends the actual request. Is that right?

Anyway, how do I allow all cross-domain PUT requests to Flask Restful API? I've used cross-domaion decorators with a (non-restful) Flask instance before, but do I need to write an OPTIONS handler as well into my API?

Answer 1

With the Flask-CORS module, you can do cross-domain requests without changing your code.

from flask.ext.cors import CORS  app = Flask(__name__) cors = CORS(app, resources={r"/api/*": {"origins": "*"}}) 

• https://pypi.python.org/pypi/Flask-Cors
• https://github.com/corydolphin/flask-cors

Update

As Eric suggested, the flask.ext.cors module is now deprecated, you should rather use the following code:

from flask_cors import CORS  app = Flask(__name__) cors = CORS(app, resources={r"/api/*": {"origins": "*"}}) 

Answer 2

You can use the after_request hook:

 @app.after_request def after_request(response):     response.headers.add('Access-Control-Allow-Origin', '*')     response.headers.add('Access-Control-Allow-Headers', 'Content-Type,Authorization')     response.headers.add('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE')     return response