Access-Control-Allow-Origin in Django app when accessed with Phonegap

Question or problem about Python programming:

I’m developing a Phonegap app for my Django based app, but when trying to make Ajax calls I get this error:

XMLHttpRequest cannot load http://domain.herokuapp.com/getcsrf/?tags=jquery%2Cjavascript&tagmode=any&format=json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. 

How can I make it so my Django app allows cross origin for some urls?

Here’s my Ajax code:

get: function() {
    $.getJSON("http://domain.herokuapp.com/getcsrf/",
    {
        tags: "jquery,javascript",
        tagmode: "any",
        format: "json"
    },
    function(data) {
        $.each(data.items, function(item){
            console.log(item);
            });
    });
}

How to solve the problem:

Solution 1:

Django by default does not provide the headers necessary to provide cross origin. The easiest way would be to just use this Django app that handles it for you: https://github.com/ottoyiu/django-cors-headers

You can then set whichever domains you want white listed using the settings

CORS_ORIGIN_WHITELIST = (
    'google.com',
    'hostname.example.com'
)

to support allowing all, just use the setting…
CORS_ORIGIN_ALLOW_ALL = True
and then do any filtering of the request in middleware or in the view.

Solution 2:

For single views you can manually add headers:

@require_GET
def api_getto(request):
    response = JsonResponse(
        # your stuff here
    )
    response["Access-Control-Allow-Origin"] = "*"
    response["Access-Control-Allow-Methods"] = "GET, OPTIONS"
    response["Access-Control-Max-Age"] = "1000"
    response["Access-Control-Allow-Headers"] = "X-Requested-With, Content-Type"
    return response

Solution 3:

In my case I was posting a file more than 1 mb and I was getting this error because of nginx configration (default max size 1 mb) So……

For me path of nginx.conf was /etc/nginx/nginx.conf.

In my case I just added client_max_body_size in http block and it worked for me

http {
    ...
    client_max_body_size 200M;
}    

Make sure to restart nginx after changing this config

Hope this helps!