AJAX with Django in RESTful environment - javascript

I am new in restful programing. I have a django website, my goal is to load part of the website asynchronously.
By default what I do now is:
call a url (e.g. localhost:8080/index) -> Routes the Django view -> View takes data from database (mongodb if you are curious) -> View gets the template -> Render all together and send back to browser
What I want to improve is:
When I have opened a url e.g. localhost:8080/index and I trigger an event (e.g. click a <a>) to send a request to my database and load other data.
My question:
What is the step I have to do to bridge the javascript / ajax with my mongodb safely?
Additionally I am considering to use a front end MCV framework (I think about backbone/I have limited knowledge as well) to handle the front-end requests. E.g. localhost:8080/index#2 returns objects with id : 2 of my database.

You should look at the following rest API frameworks for django. They will help save you a lot of time.
Django Tastypie
Django Rest Framework
I have used both and personally like tastypie better. Once you have integrated one of these in your project you can use any front end javascript framework like angularjs or backbone or even not use one and simply make a call to the resource url to get the data via ajax.

Related

Symfony to "proxy" a webservice?

I'm struggling a bit with the following: I have a symfony web-application which calls a webservice (hosted on another server). The webservice returns a JSON object with calendar data, and in my symfony controller this data is saved in an array. For the visualisation of the calendar towards the users I use https://fullcalendar.io/, which needs to be "feeded" the data from the webservice.
This works fine when the browser of the users connects directly towards the webservice to "read" the JSON stream with pretty standard Javascript, but the aim is that there will be no direct connections to the werbservice, only to the symfony webserver.
So I want the connection to go as followed:
User-browser -> Symfony webserver ->(JSON) -> Webservices -> SQL server
But currently the User-browser has also still "one leg to the webservices" to consult the JSON feed with calendar items.
I think I'm missing something which is in plain sight, but how can I avoid that the user calls directly the Webservice?
I could make a (similar) webservice that gives a JSON feed on the
symfony apllication (and so actually make my webserver act in a
certain way as a proxy for the webservice server).
I could try to
work with a global variable
(https://fullcalendar.io/docs/events-array) that contains the array
with the calendar items (could become messy when multiple users work
simultaneously on it).
But these don't seem correct approaches to me...
Am I missing something obvious?
The symfony documentation link is, in my mind, the best answer to be given to this question ->
symfony.com/doc/current/frontend/encore/server-data.html

Dynamic Data in Shopify Blog Page

I want to write an API, i.e. hosted at www.api.mywebsite.com (not affiliated with Shopify) and then have a shopify blog post that queries that API and displays that data using javascript.
I know how to do the API potion, but can I and if so how do I do the second part where I use JS to query and display data?
Simple! Add an App Proxy to your App. With that, you setup an end point to call in your App. On the blog page you can send an Ajax GET with an ID to your App, which can then get dynamic content ready for you to use. You can either format the response as Liquid or as JSON as two examples. Send back Liquid, and Shopify renders it for you. Send back JSON and you can stamp out your data in a template.
And best of all it is a secure callback to your App that you know came from Shopify, so you have no hassles or security problems. Look in your App for Extensions, and enable Online Store, where you can tinker with the Proxy.

Django: Page Refresh

Here's the view that updates the timestamp of a model in database whenever it's called,
def data(request):
new = Data.objects.filter(user=request.user)
new.update(timestamp=timezone.now())
return HttpResponse('')
This view is related to this URL,
url(r'^go/$', views.data, name='data')
Everything is fine, but how can I call this view & update the database without refreshing the page?
This is a great question as its something that may not seem as logical in django as say node or js based server and client interactions. Let me give a generic response then go more detailed.
Django is a web server. It has some newer functionality that allows it to more easily interact with javascript than it could in the past, but it is normally used in conjunction with a javascript framework. I'll normally build a django app w/ django-rest-framework and reactjs. So my workflow is normally to build the datamodel, serve up the page with compiled js as a static asset, and have those two communicate via a rest-api stood up with DRF.
Specifically to your question, you can simply have your django model communicate with the server via ajax posting to endpoint in your app. An example of a jquery/ajax post is available at this link. The only other thing you will want to look into is supporting csrf which Django discusses in the docs.
Let me know if this helps. If it does but requires specific snippets, let me know.

How to post a form to django site, securely and from another site

I have a django app which need to receive post requests from another site using html+javascript.
For example i have mydjangosite.com and smallhtmlsite.com
What i want is : user visit smallhtmlsite.com and fill a form, then he pushing submit button and mydjangosite.com receive request and create objects(form saving models actually).
So i will have a view which will handle this requests. But how can these been done securely?
I have a django app which need to receive post requests from another
site using html+javascript.
You don't have to ! You can build an API instead ;)
You create an API call - small site calls the API of main site. In that situation, the form is handled by a view in small site and the API is called via the server. Check out Django REST Framework.
Note: That solution wouldn't stop you from using AJAX but it would avoid cross domain issues.

Django angular database integration

I have a django project that uses postgresql. I am trying to use angular as a front end in my html pages. Which is the best approach to use the angular js controllers in the django project to connect to the django models and the database to perform basic operations like insert, delete, update etc?
Currently i just have static data that i defined in my angular controller. But i would like to know how to get the data from the database dynamically. Any advice will be helpful
As per my experience with Django and AngularJs, first you should make api in django to get the data from database. Afterthat, in single page application, you should make angularjs service for each api in controller. After rendering data, you can submit / modify your data either through api or through form submission(with form validation).

Categories

Resources