Angular 4 call couchdb 有 CORS 错误，但 fiddler 中没有预检

Question

我有一个用 Angular 4 编写的应用程序在本地主机上调用 couchdb，但端口不同。

我一直在使用 couchdb 和 Aurelia 应用程序，没有任何问题。

现在我切换到 Angular 4 和 Angular MD，我似乎可以解决这个问题。

这是调用 Couchdb 的代码

private commonUpdate(content: any, url: string, method: string = 'put') {

console.log("in common")
const myHeaders = new Headers();
myHeaders.append('Content-Type', 'application/json');

const options = new RequestOptions({ headers: myHeaders, withCredentials: true });

if (content && content._rev && content._rev.length >= 5) {
  url = url + '/' + content._id;
}

const status = new DbStatus();
status.ok = false;

let response: any;
try {
  if (content) {
    const contentJson: string = JSON.stringify(content);
    this.http.post(url, contentJson, options).map(res => res.json()).subscribe(data => {
      console.log(data['results']);
    })
  } 

  status.ok = this.isHttpStatusSuccess(response.status);
  if (status.doc) {
    if (Array.isArray(status.doc.docs)) {
      if (status.doc.docs.length === 0) {
        status.ok = false;
        status.reason = 'Empty Array';
        if (!status.error) status.error = status.reason;
      }
    }
  }
  status.httpStatus = response.status;
  status.response = response;
} catch (error) {
  status.ok = false;
}

错误信息：

VM27427:1 XMLHttpRequest 无法加载 localhost:5984/_session。仅协议方案支持跨源请求：http、data、chrome、chrome-extension、https.

[cors] 
origins = *
credentials = true
headers = accept, authorization, content-type, origin, referer
Couch-Rev, Set-Cookie
methods = GET, PUT, POST, HEAD, DELETE

我不明白为什么这行得通。同样，fiddler 不显示预检选项方法请求。

但是运行来自 postman returns 的 OPTION 方法允许 GET 和 HEAD 方法。也许浏览器正在缓存它，但我打开了开发工具并选中了缓存禁用设置。

建议

Answer 1

VM27427:1 XMLHttpRequest cannot load localhost:5984/_session. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

听起来问题只是你在代码中给 this.http.post 调用的 URL 没有协议部分——也就是说，你只给 localhost:5984/_session 到电话，但你应该给它 http://localhost:5984/_session。您只需添加 http://.

至于为什么你没有看到 OPTIONS 请求，我想那只是因为浏览器在尝试 OPTIONS 之前就停止了——因为 OPTIONS 中没有协议部分=21=]，浏览器甚至无法确定你提供的 URL 是否是跨源的。

Angular 4 call couchdb 有 CORS 错误，但 fiddler 中没有预检

Angular 4 call couchdb has CORS error, but no preflight shows up in fiddler

couchdb

xmlhttprequest

cors

preflight

angular