How do I POST new data to CouchDB using JavaScript/jQuery

Question

I found the answer here to the question below.

I needed to setup a reverse proxy in apache which took about 2 minutes by adding the following line to my virual host;
ProxyPass /couchdb/ http://dojo:5984/
Because of the same origin policy you can't post data across ports. I knew this applied to domains but not different ports so you set up a reverse proxy.

---

I would like to know how I can POST data to couchDB using JavaScript or jQuery.

I followed this tut and created a database and I'm able to post and get data using curl and it all works fine. There are curl examples below that I used.

I'm also able to get data using jQuery but I don't know how to POST to CouchDB

curl -X GET http://127.0.0.1:5984/mycouchshop/_all_docs.
curl -X POST http://127.0.0.1:5984/mycouchshop/ -d @person.json -H "Content-Type: application/json"

I'm able to get and display data using jQuery. The code below works fine.

  $.ajax({
    url : 'http://couchdb:5984/mycouchshop/_design/peoples/_view/people',
    type : 'GET',
    dataType : "jsonp",
    success : function(json) {}
  });

But posting data results in a 405 Method Not Allowed

  $.ajax({
    url : 'http://couchdb:5984/mycouchshop/',
    data : {"forename": "Bob", "surname": "McHamster", "type": "person"},
    contentType : "application/json", 
    type : 'POST',
    dataType : "json",
    success : function(resp) {}
  });

Answer 1

Same origins security policy

I am no couchapp expert, but I ran into the same issue. The problem is that your are getting into cross-domain restrictions, your app being served from one port and the couchdb being accessed on another port. From couchapp.org:

A common question I get from people starting to write Ajax apps using CouchDB, is "when I try to query the CouchDB with jQuery, it doesn't work." Usually it turns out that they have an index.html file on their filesystem, which is attempting to do an Ajax call against the CouchDB server. After I explain to them the same origin security policy, they start to understand this this means CouchDB needs to serve their HTML (rather than loading it in the browser direct from the filesystem).

So, the simplest possible CouchApp is just an HTML file, served directly from CouchDB, that uses Ajax to load and save data from the CouchDB.

Using couchapp

It seems that all application files need to be "pushed" to the couchdb server, using couchapp (http://couchapp.org/page/index). I am working from a Mac, so I used the Standalone executable. Instructions to install couchapp are there

A Tutorial

When you understand how couchapp works, you can use this tutorial

Next steps

I am trying to figure them out... if you find anything good, please share! Good luck!

EDIT: I just found this tutorial

Answer 2

Another solution to resolve the Cross-Origin Resource Sharing (CORS) issue is by changing some settings on your local CouchDB installation.

Just follow the answer posted on this Question: Couchdb cors problems