如何在CouchDB中添加跨域资源共享(CORS)-- 请求的资源上没有“Access-Control-Allow-Origin”头部信息

20

我正在尝试创建一个HTML文件,将数据从PouchDB同步到CouchDB,但是在Chrome控制台中出现以下错误。

Uncaught TypeError: 无法调用null的'addEventListener'方法 OPTIONS http://localhost:5984/todos/ 405 (方法不允许) OPTIONS http://localhost:5984/todos/ 请求的资源没有'Access-Control-Allow-Origin'标头。因此,源'http://localhost:8080'不允许访问。XMLHttpRequest无法加载http://localhost:5984/todos/。请求的资源上没有'Access-Control-Allow-Origin'标头。因此,源'http://localhost:8080'不允许访问。 OPTIONS http://localhost:5984/todos/ 请求的资源没有'Access-Control-Allow-Origin'标头。因此,源'http://localhost:8080'不允许访问。pouchdb-nightly.js:3496 OPTIONS http://localhost:5984/todos/ 请求的资源没有'Access-Control-Allow-Origin'标头。因此,源'http://localhost:8080'不允许访问。pouchdb-nightly.js:3496 XMLHttpRequest无法加载http://localhost:5984/todos/。请求的资源上没有'Access-Control-Allow-Origin'标头。因此,源'http://localhost:8080'不允许访问。
我找到了一个避免这个问题的方法。我需要使用以下命令打开Chrome:cd C:\Program Files (x86)\Google\Chrome\Application Chrome.exe --disable-web-security。但这并没有解决问题。我在这里看到了很多类似的问题,但由于我对这个领域相对较新,所以我不明白任何答案。

你遇到了我们所谓的"同源策略"。默认情况下,浏览器不允许您向与托管页面的服务器具有不同协议和端口的服务器发出ajax请求。链接文章中有很多有用的信息。 - rescuecreative
谢谢......但是那个链接没有包含标题的代码。 - ess
你不能在客户端的JavaScript或HTML文件中设置该标头。它是关于来自服务器响应中的标头。 - rescuecreative
你能提供一个解决方案吗?我正在使用HTML、JS并同步PouchDB和CouchDB。http://pouchdb.com/getting-started.html - ess
1
你可以在客户端使用 response.addheader("","*"); 来设置头部。 - Pradeep.PG
9个回答

47

来自这份文档

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...你能解释一下“通配符或白名单”吗?我在这个领域是新手。 - ess
我在local.ini中添加了CORS,但是出现了以下错误...->无法加载资源:凭据标志为“true”,但“Access-Control-Allow-Credentials”头为空。 - ess
2
我搞定了……谢谢@robertc。我在local.ini中添加了以下行……[cors] origins = * credentials = true methods = GET,PUT,POST,HEAD,DELETE headers= accept,authorization,content-type,origin - ess
2
所有在Debian/Ubuntu上通过软件包管理器安装CouchDB的用户请注意。截至今天(2014年10月10日),您将获得版本1.2,它不支持CORS选项。如果您想使用它们,您必须从源代码安装更新版本。我花了一点时间才意识到为什么我的CORS设置无法工作,原因是我通过apt-get install couchdb安装了它,而它是1.2版本。 - szydan
3
在Ubuntu上,您可以使用以下PPA安装版本1.6.1,该版本支持CORS。https://launchpad.net/~couchdb/+archive/ubuntu/stable - Thaddeus Albers
显示剩余3条评论

9

接受的答案并不能解决我的问题。我所做的是 -

更新本地配置文件 local.ini (/安装位置/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

然后以管理员模式打开CMD并运行 -
net.exe stop "Apache CouchDB" && net.exe start "Apache CouchDB"

仅适用于Windows用户


1
或者您可以使用Web界面,即http://localhost:5984/_utils/fauxton/#_config。 - Robert
对于Linux用户,在更新local.ini文件后,通过运行以下命令重启CouchDB服务:sudo service couchdb restart - Faizan Noor

4

CouchDB UI 可以通过 http://localhost:5984/_utils 访问(或者是你的 CouchDB 运行的 URL 后面加上 /_utils)。在里面,你可以进入 Configuration > CORS 来启用或禁用 CORS。

enter image description here


3

CouchDB中的CORS部分:

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

注意 x-requested-with


3

3

0
对于 Windows 用户,请进入 Apache 安装文件夹(C:\Program Files (x86)\Apache Software Foundation\CouchDB\etc\couchdb),并使用以下详细信息更新 local.ini 文件... 对我非常有效,谢谢大家。
 [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

显然,为了完整性,请重新启动Apache CouchDB服务 :)

0
根据 @szydan 的评论,在您的软件包管理器仍然提供不支持CORS OPTIONS的1.2版本的情况下,您需要从源代码进行安装。
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/

您可能需要安装SpiderMonkey和jsapi依赖项


0

必须在方法属性上放置OPTIONS

[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

即使您在运行时引导您的数据库(nodejs/nano版本):
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'}))

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接