20

I am trying to create a html file which synchronize data from a pouchDb to couchDb ..but iam getting the following error in chrome console.

Uncaught TypeError: Cannot call method 'addEventListener' of null

OPTIONS http://localhost:5984/todos/ 405 (Method Not Allowed)

OPTIONS http://localhost:5984/todos/ No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. XMLHttpRequest cannot load http://localhost:5984/todos/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. OPTIONS http://localhost:5984/todos/ No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. pouchdb-nightly.js:3496 OPTIONS http://localhost:5984/todos/ No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. pouchdb-nightly.js:3496 XMLHttpRequest cannot load http://localhost:5984/todos/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.

I found a way to avoid this issue. That is i have to open chrome using the below command: cd C:\Program Files (x86)\Google\Chrome\Application Chrome.exe --disable-web-security.But this didn't solve the issue. I saw a lot of similar question here.but i didn't understand any answer since i am relatively new in this field

sideshowbarker
  • 81,827
  • 26
  • 193
  • 197
ess
  • 663
  • 3
  • 9
  • 17
  • You're running into what we call ["same origin policy"](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Same_origin_policy_for_JavaScript). By default, browsers will not allow you to make ajax requests to servers that do not have the same protocol and port as the server hosting the page. Lots of good info in the linked article. – rescuecreative Jan 03 '14 at 05:52
  • thanks.....but that link didnt have any code for including the header – ess Jan 03 '14 at 06:06
  • You can't set that header in your client side JavaScript or html file. It's talking about the header in the response from the server. – rescuecreative Jan 03 '14 at 06:09
  • can you give a solution....i am using html,js and synching pouchdb and couch db http://pouchdb.com/getting-started.html – ess Jan 03 '14 at 06:18
  • 1
    you can set header by response.addheader("","*"); in client side – Pradeep.PG Jan 18 '14 at 05:25

9 Answers9

47

From this documentation:

To enable CORS support, you need to set the enable_cors = true option in the [httpd] section of local.ini, and add a [cors] section containing a origins = * setting. Note that by default, no origins are accepted; you must either use a wildcard or whitelist.

[httpd]
enable_cors = true

[cors]
origins = *
robertc
  • 74,533
  • 18
  • 193
  • 177
  • thanks @robertc ... cann you explain "wildcard or whitelist"... I m new in this field – ess Jan 06 '14 at 04:25
  • i added cors in local.ini... but get the following error....-> Failed to load resource: Credentials flag is 'true', but the 'Access-Control-Allow-Credentials' header is ''. – ess Jan 06 '14 at 04:33
  • 2
    i got it.........thanks @robertc..i added the following line in local.ini...[cors] origins = * credentials = true methods = GET,PUT,POST,HEAD,DELETE headers= accept, authorization, content-type, origin – ess Jan 06 '14 at 07:12
  • 2
    Notice for all installing couchdb on debian/ubuntu via package manager. As of today (10-Oct-2014) the version you will get is 1.2 and it does NOT support CORS options. If you want to use them you have to install never version from sources. It took me a bit to realise why my CORS settings did not work, and the reason was I've installed it via apt-get install couchdb and it was version 1.2. – szydan Oct 10 '14 at 09:40
  • I accidentally put `origin=*`, instead of "origins", throwing this out there in case someone makes the same easily missable mistake. – Santiago Angel Nov 05 '14 at 15:04
  • 3
    @szydan On Ubuntu you can use the following PPA to install version 1.6.1 which does support CORS. https://launchpad.net/~couchdb/+archive/ubuntu/stable – Thaddeus Albers Jan 15 '15 at 02:43
  • @ThaddeusAlbers thanks for bringing this up I've upvoted your comment – szydan Jan 17 '15 at 22:58
  • If you are testing the success of your efforts, don't forget to set the Origin-Header. Otherwise you woun't see the Access-Control-Allow-Origin-Header and debug for like a full evening – Hoffmann May 29 '17 at 14:25
9

Accepted answer doesn't solve my problem. What i did is -

update local.ini (/installation location/CouchDB/etc/couchdb)

[httpd]
enable_cors = true

[cors]
origins = *
credentials = true
methods = GET, PUT, POST, HEAD, DELETE
headers = accept, authorization, content-type, origin, referer, x-csrf-token

Then open CMD in administrator mode and run -

net.exe stop "Apache CouchDB" && net.exe start "Apache CouchDB"

*** for windows user only

HADI
  • 2,829
  • 1
  • 26
  • 26
  • 1
    Or you can use the web interface for this, i.e. http://localhost:5984/_utils/fauxton/#_config. – Robert Jun 03 '16 at 10:10
  • For linux users, after updating local.ini, restart CouchDB service by running the command: sudo service couchdb restart – Faizan Noor Apr 29 '17 at 16:13
3

CORS section in couchdb:

credentials: true
headers: accept, authorization, content-type, origin, referer, cache-control, x-requested-with
methods: GET,PUT,POST,HEAD,DELETE
origins: *

Notice x-requested-with

3

There is now a tool that will add CORS to CouchDB for you:

npm install -g add-cors-to-couchdb
add-cors-to-couchdb

More documentation here: https://github.com/pouchdb/add-cors-to-couchdb

nlawson
  • 11,510
  • 4
  • 40
  • 50
3

Easiest way i found is to install the following:

npm install -g add-cors-to-couchdb

Then run the tool i.e. "add-cors-to-couchdb" from the command line like this:

add-cors-to-couchdb <you_url>:<port> -u <user_name> -p <your_password>

Check out the following link for CouchDB how to CORS reference

Rodrigo Rubio
  • 1,686
  • 2
  • 16
  • 26
2

The CouchDB UI can be accessed on http://localhost:5984/_utils (or whatever URL your CouchDB is running on followed by /_utils). Inside that, you can go to Configuration > CORS and enable or disable CORS.

enter image description here

Nikhil Sinha
  • 481
  • 7
  • 5
0

Per @szydan comment, in case your package manager still serves you 1.2 version, which doesn't support CORS OPTIONS, you need to install it from source.

echo "deb http://binaries.erlang-solutions.com/debian `lsb_release -cs` contrib"  | tee /etc/apt/sources.list.d/erlang-solutions.list
wget -O - http://binaries.erlang-solutions.com/debian/erlang_solutions.asc |  apt-key add -
echo "deb http://packages.cloudant.com/debian `lsb_release -cs` main" | tee /etc/apt/sources.list.d/cloudant.list
wget http://packages.cloudant.com/KEYS -O - |  apt-key add -
apt-get update -y
apt-get install -y erlang-nox erlang-dev
apt-get install -y build-essential
apt-get install -y erlang-nox
apt-get install -y libmozjs185-cloudant libmozjs185-cloudant-dev
apt-get install -y libnspr4 libnspr4-0d libnspr4-dev libcurl4-openssl-dev curl libicu-dev

useradd -d /var/lib/couchdb couchdb
mkdir -p /usr/local/{lib,etc}/couchdb /usr/local/var/{lib,log,run}/couchdb /var/lib/couchdb
chown -R couchdb:couchdb /usr/local/{lib,etc}/couchdb /usr/local/var/{lib,log,run}/couchdb
chmod -R g+rw /usr/local/{lib,etc}/couchdb /usr/local/var/{lib,log,run}/couchdb


http://www.apache.org/dyn/closer.cgi?path=/couchdb/source/

tar xzf apache-couchdb-*.tar.gz
cd apache-couchdb-*
./configure --prefix=/usr/local --with-js-lib=/usr/lib --with-js-include=/usr/include/mozjs --enable-init
make && sudo make install

sudo ln -s /usr/local/etc/init.d/couchdb /etc/init.d/couchdb
sudo /etc/init.d/couchdb start
sudo update-rc.d couchdb defaults

#check if it runs
curl http://127.0.0.1:5984/

You may need to install SpiderMonkey and jsapi dependencies

Michael
  • 1
  • 1
0

For windows users , go into apache install folder(C:\Program Files (x86)\Apache Software Foundation\CouchDB\etc\couchdb) <-- was here for me , and update the local.ini file with the below details ...worked a charm for me , thanks guys

 [cors]
 credentials: true
 headers: accept, authorization, content-type, origin, referer, cache-control,          x-requested-with
 methods: GET,PUT,POST,HEAD,DELETE
 origins: *

 [httpd]
 enable_cors = true

obviously , restart the apache couchdb service for completeness :)

0

Must put OPTIONS on methods attribute.

[cors]
 credentials: true
 headers: accept, authorization, content-type, origin, referer, cache-control,          x-requested-with
 methods: GET,PUT,POST,HEAD,DELETE,OPTIONS
 origins: *

[httpd]
 enable_cors = true

even if u bootstrap your db on-the-fly (nodejs/nano version):

nano.request({db: '_node', path: '/nonode@nohost/_config/couch_peruser/enable', method: 'PUT', body: 'true'})
      .then(() => nano.request({db: '_node', path: '/nonode@nohost/_config/httpd/enable_cors', method: 'PUT', body: 'true'}))
      .then(() => nano.request({db: '_node', path: '/nonode@nohost/_config/cors/origins', method: 'PUT', body: '*'}))
      .then(() => nano.request({db: '_node', path: '/nonode@nohost/_config/cors/credentials', method: 'PUT', body: 'true'}))
      .then(() => nano.request({db: '_node', path: '/nonode@nohost/_config/cors/headers', method: 'PUT', body: 'accept, authorization, content-type, origin, referer'}))
      .then(() => nano.request({db: '_node', path: '/nonode@nohost/_config/cors/methods', method: 'PUT', body: 'GET, PUT, POST, HEAD, DELETE, OPTIONS'}))
Gabriel Mancini
  • 316
  • 2
  • 6