小编sid*_*ker的帖子

在我的 React 应用程序中，我有以下 API POST 来允许用户编辑他们的个人资料（名称和图像）。

  static updateProfile(formData, user_id) {
    const request = new Request(`http://localhost:4300/api/v1/profiles/${user_id}`, {
      headers: new Headers({
        'Authorization': getBearerToken()
      }),
      mode: 'no-cors',
      method: "POST",
      body: formData
    });

    return fetch(request).then(response => {
      return response.json();
    }).catch(error => {
      return error;
    });
  }

上述问题是带有授权令牌的标头未在 POST 中发送...

如何获取要在上面的获取请求中发送的授权标头？

仅供参考，对于非多部分表单，授权令牌已成功发送，如下所示：

  static loadProfile(user_id) {
    const request = new Request(`http://localhost:4300/api/v1/profiles/${user_id}`, {
      headers: new Headers({
        'Authorization': getBearerToken(),
        'Accept'       : 'application/json',
        'Content-Type' : 'application/json',
      })
    });

    return fetch(request).then(response => {
      return response.json();
    }).catch(error => {
      return error; …

我有一个项目，我正在尝试从数据处理程序下载一些制表符分隔值格式的数据，但是，Google Chrome 正在发送 Origin 标头值的空值。

当我导航到http://server.corp.somebiz.com/reportpages/Report_Page_Requests_Over_Time.aspx?app=76ac42b7-ba6f-4be4-b297-758ebc9fe615时，我看到了这一点

var url = \'http://server.corp.somebiz.com/DataHandlers/ReportSets.ashx?task=pagerequestsovertime&app=188d1956-c4a7-42f7-9bdd-38f54c14e125&format=tsv\';\n\nd3.tsv(url, function(d) {\n  d.date = parseTime(d.date);\n  d.close = +d.close;\n  return d;\n}, function(error, data) {\n  if (error) throw error;\n\n  console.log(\'Do stuff\');\n});\n

以下是请求的原始标头：

GET /DataHandlers/ReportSets.ashx?task=pagerequestsovertime&app=786b5ef3-1389-4890-8004-533fd1f66f16&format=tsv HTTP/1.1\nHost: server.corp.somebiz.com\nConnection: keep-alive\naccept: text/tab-separated-values,*/*\nOrigin: null\nUser-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36\nAccept-Encoding: gzip, deflate, sdch\nAccept-Language: en-US,en;q=0.8\n

这最终会在控制台上出现错误：

XMLHttpRequest cannot load http://server.corp.somebiz.com/DataHandlers/ReportSets.ashx?task=pagere\xe2\x80\xa66ac42b7-ba6f-4be4-b297-758ebc9fe615&start=2/1/2017&end=3/2/2017&format=tsv. The \'Access-Control-Allow-Origin\' header has a value \'http://server.corp.somebiz.com\' that is not equal to the supplied origin. …

我一直在尝试iron-ajax向服务器发送一个简单的帖子，但在飞行前调用时它一直失败。对于我的一生，我无法弄清楚发生了什么，服务器上的所有 CORS 标头似乎都是正确的。

Response headers

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:Content-Type
Access-Control-Allow-Methods:GET, POST, PUT, OPTIONS
Access-Control-Allow-Origin:*
cache-control:must-revalidate, private, no-cache, no-store, max-age=0
Connection:Keep-Alive
Content-Encoding:gzip
Content-Length:138
Content-Type:text/html

Request headers

Accept:*/*
Accept-Encoding:gzip, deflate, sdch, br
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:content-type
Access-Control-Request-Method:POST
Cache-Control:no-cache
Connection:keep-alive

该请求确实是从本地主机发出的，但我认为应该*处理这个问题。

控制台中显示的错误是： OPTIONS https://... 403 (Forbidden)和

XMLHttpRequest cannot load https://.... Response for preflight has invalid HTTP status code 403

任何帮助/建议表示赞赏。

我有一个Laravel 5.4 API,在Postman和浏览器中工作正常.Localhost工作正常 - Laravel 5.4在一个端口上运行,而热部署模式下的Vue运行正常.

但是,当我将Vue代码移动到我的生产服务器时,我收到此错误:

Response for preflight is invalid (redirect)

在Chrome开发者工具中,网络标签显示以下内容:

一般

Request URL:http://backend-dev.xolas.io/api/v1/view/calendar/-30/90/
Request Method:OPTIONS
Status Code:301 Moved Permanently
Remote Address:217.182.66.247:80
Referrer Policy:no-referrer-when-downgrade

响应标题

Connection:Keep-Alive
Content-Length:349
Content-Type:text/html; charset=iso-8859-1
Date:Mon, 10 Jul 2017 13:40:08 GMT
Keep-Alive:timeout=5, max=100
Location:http://backend-dev.xolas.io/api/v1/view/calendar/-30/90
Server:Apache/2.4.25 (Ubuntu)

起源标题

Accept:*/*
Accept-Encoding:gzip, deflate
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:access-control-allow-origin,authorization
Access-Control-Request-Method:GET
Connection:keep-alive
Host:backend-dev.xolas.io
Origin:http://localhost:8080
Referer:http://localhost:8080/
User-Agent:Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.109 Mobile Safari/537.36

我在Laravel上安装了一个CORS插件,仍然没有任何乐趣.

我的axios配置如下:

axios.defaults.headers.common['Authorization'] = store.apiKey
axios.defaults.headers.get['Content-Type'] = 'application/json;charset=utf-8'
axios.defaults.headers.post['Content-Type'] = …

我试图使用快速Cors与我的resitfy服务器,它似乎并没有否认来自其他ips的请求.我在本地工作所以我尝试将原点设置为随机的公共IP,但我的所有请求仍在进行中

这是我的路线:

module.exports = function(app) {
    var user = require('./controllers/userController');
    var cors = require('cors');
    var corsOptions = require('./cors.json');


    app.post('/auth/signup', cors(corsOptions),user.createUser);
    app.post('/auth/login', cors(corsOptions), user.validateUser);
    app.post('/auth/generateKeys', cors(corsOptions), user.generateKeys);
    app.post('/auth/generateToken', user.generateToken);
};

这是我的cors.json文件,我已经设置了一个随机的ip:

{
    "origin": "http://172.16.12.123",
    "optionsSuccessStatus": 200,
}

在路线上设置了cors我可以在邮递员中看到以下内容,但请求仍在进行中？我希望访问被拒绝响应.

Access-Control-Allow-Origin→ http://172.16.12.123

我正在努力通过 CORS 获取授权：

const token = 'this.is.secret!';
fetch('http://corsserver/api/hello', {
    method: 'get',
    credentials: 'include',
    mode: 'cors',
    headers: {
        'Authorization': `Bearer ${token}`,
        'Content-Type': 'application/x-www-form-urlencoded'
    }
}).then(response => {
  console.log(response);
}).catch(error => {
  console.log(error);
});

当我运行此请求时，Chrome 将标头设置为：

Request Method:OPTIONS

我查了一下，这是一个预检请求。

我的意思是，这真的很酷。但是，我不知道如何在预检回来后发送实际请求，好吧！下一步是什么？如何发送 GET 请求？

我在这里遗漏了一些非常基本的东西。

我刚刚在维基百科上读到（基于 W3 分钟），CORS 现在已经过时了：

https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

来自https://www.w3.org/2017/08/16-webappsec-minutes.html#item03的会议记录

过时的 CORS

dveditz：我在列表中提出了过时的 CORS。规范是旧的，并没有反映浏览器的实际操作

抄写员......正在进行的工作在Fetch中

UNKNOWN_SPEAKER：所以让 CORS闲置是没有用的
......标记为过时并指向替换
......更好地为实现者服务
......唯一的回复是mnot询问开发人员的CORS
......我想得到Brad的反馈
……我会就这个电话呼吁达成共识，然后在名单上公布

dveditz：对过时 CORS 有任何反对意见吗？

terri：对我来说听起来很合理

提议：过时的 CORS

解决方案：过时的 CORS

dveditz：我会在名单上宣布这个决定

这怎么可能，是什么让 CORS 过时了？

我试图找出将“Access-Control-Allow-Origin”标头添加到我的 create-react-app dev Server 配置的位置。

到目前为止，我将它添加到config/webpackDevServer.config.js没有太多运气。

知道我可以在哪里添加它吗？

谢谢！

我有来自我的服务器的响应buildings : [record1, record2, ...],我想只得到该响应的数组.我怎样才能从Promise获得数组？我尝试了一些异步/等待的东西,但我不明白如何在这段代码中使用它:

setupImpagination() {
    ....
    fetch(pageOffset, pageSize, stats) {
        return fetch(`http://localhost:3000/api/building/all?skip=${pageOffset}&limit=${pageSize}`)
            .then(response => {
            console.log('response.json() => ',response.json());
            response.json()
            })
            .catch((error) => {
            console.error(error);
            });

    }
    });
}

我正在尝试向Wikipedia API发送get请求.我发送请求形式一个角度前端所以我正在尝试使用Heroku CORS Anywhere端点来避免CORS问题.出于某种原因,我仍然得到503响应,表示请求的资源上没有access-control-allow-origin报头.知道为什么会发生这种情况/我还能尝试什么？

我的代码:

import { Injectable } from '@angular/core';
import { Http, Response, } from '@angular/http';
import { Observable } from 'rxjs/Rx';



@Injectable()
export class RestService {
    API_URL: string = 'https://cors-anywhere.herokuapp.com/https://en.wikipedia.org/wiki/';

  constructor(private http: Http) { }

  public getRandomArticle() : Observable<any> {
        return this.http.get(`${this.API_URL}Special:Random`)
        .map((res: Response) => res.json())
        .catch((err: any) => Observable.throw(err || 'server error'));
  }

}