We have been working in a big application built with Django and Tastypie in the Backend and AngularJS in the frontend, Build the mobile app with Phonegap makes sense because we can reuse much code from our web counterpart.
Although working with your own API and debugging it in the phone/simulator is not usually the fastest way of debugging, so we usually work with the API as JSONP until It’s necessary to test it in the simulator/phone.
If you want to do that with AngularJS services keep in mind you need to deactivate some security from $http service, and you will need to activate that security again when going to production or testing the real app in the phone/simulator to have the real functionality.
You can do that in AngularJS removing this header provisionally in your configuration.
If you are using Django and/or Tastypie you will need to activate a middleware to enable JSONP requests.
from django import http try: from django.conf import settings XS_SHARING_ALLOWED_ORIGINS = settings.XS_SHARING_ALLOWED_ORIGINS XS_SHARING_ALLOWED_METHODS = settings.XS_SHARING_ALLOWED_METHODS XS_SHARING_ALLOWED_HEADERS = settings.XS_SHARING_ALLOWED_HEADERS XS_SHARING_ALLOWED_CREDENTIALS = settings.XS_SHARING_ALLOWED_CREDENTIALS except AttributeError: XS_SHARING_ALLOWED_ORIGINS = '*' XS_SHARING_ALLOWED_METHODS = ['POST', 'GET', 'OPTIONS', 'PUT', 'DELETE'] # CAUTION! This one is very dangerous XS_SHARING_ALLOWED_HEADERS = ['Content-Type', '*', 'Authorization'] XS_SHARING_ALLOWED_CREDENTIALS = 'true' class XsSharing(object): """ This middleware allows cross-domain XHR using the html5 postMessage API. Access-Control-Allow-Origin: http://foo.example Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE Based off https://gist.github.com/426829 """ def process_request(self, request): if 'HTTP_ACCESS_CONTROL_REQUEST_METHOD' in request.META: response = http.HttpResponse() response['Access-Control-Allow-Origin'] = XS_SHARING_ALLOWED_ORIGINS response['Access-Control-Allow-Methods'] = ",".join( XS_SHARING_ALLOWED_METHODS ) response['Access-Control-Allow-Headers'] = ",".join( XS_SHARING_ALLOWED_HEADERS ) response['Access-Control-Allow-Credentials'] = XS_SHARING_ALLOWED_CREDENTIALS return response return None def process_response(self, request, response): response['Access-Control-Allow-Origin'] = XS_SHARING_ALLOWED_ORIGINS response['Access-Control-Allow-Methods'] = ",".join( XS_SHARING_ALLOWED_METHODS ) response['Access-Control-Allow-Headers'] = ",".join( XS_SHARING_ALLOWED_HEADERS ) response['Access-Control-Allow-Credentials'] = XS_SHARING_ALLOWED_CREDENTIALS return response
This will be the middleware, We added an Allowed header to test if the access token is working, this is dangerous and It’s critical to remove it when you are done testing. Then you just activate it in the settings.py file.
MIDDLEWARE_CLASSES = ( ... 'mymodule.xhr_middleware.XsSharing' )
That’s it! If everything goes well you will be able to debug your app with your own API from your browser. :-)
WARNING! Be careful when uploading to production and disable this tricks!