小编sid*_*ker的帖子

自定义标头已添加到Access-Control-Request-Headers中

我正在尝试向我的有角js GET请求中添加自定义标头,如下所示:

    $http({
        method : 'GET',
        url : s,
        headers : {
        "partnerId" : 221,
         "partnerKey" : "heeHBcntCKZwVsQo"
        }
    })
Run Code Online (Sandbox Code Playgroud)

但是问题是标题被添加到如下所示的Access-Control-Request-Headers中,并且我收到403禁止响应:

User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:50.0)
Gecko/20100101 Firefox/50.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/ *;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Access-Control-Request-Method: GET
Access-Control-Request-Headers: partnerid,partnerkey
Origin: http://localhost:8080
DNT: 1
Connection: keep-alive
Run Code Online (Sandbox Code Playgroud)

我也尝试了以下更改,但没有运气

return $http.get(s, {
    headers : {
        'partnerId' : 221,
        'partnerKey': 'heeHBcntCKZwVsQo'
        }
    })
Run Code Online (Sandbox Code Playgroud)

在SO的其他相关答案中,我看到需要在服务器端启用标头partnerId和partnerKey。但是我能够在POSTMAN客户端和其他POST客户端中添加这些自定义标头,并能够获得预期的响应。所以我想我缺少了一些东西。有人可以在这方面指导我。提前致谢

编辑:我注意到的另一件事是,在传递请求时,partnerId被替换为partnerid。不知道这是否有所作为。

javascript cors angularjs angular-http

3
推荐指数
1
解决办法
2476
查看次数

如何从javascript调用IBM Watson服务

我正在使用IBM Watson服务实现虚拟代理.我的应用程序是使用Jquery,Angular JS和Java开发的.目前我从java中间层调用watson服务.但我想避免这种情况,并直接从javascript调用.当我使用XML Http请求从javascript调用时,我收到CORS错误.如何解决这个问题?

以下是我的代码:

var username = "uid";
var password = "pwd";
var xhr = new XMLHttpRequest();
xhr.open('GET', 'url');
//xhr.withCredentials = true;
xhr.setRequestHeader("Access-Control-Allow-Headers", "Access-Control-Allow-Origin,Content-Type, application/json, Authorization");
xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
xhr.setRequestHeader('Access-Control-Allow-Credentials', '*');
xhr.setRequestHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
xhr.setRequestHeader('Content-Type', undefined);
xhr.setRequestHeader('Authorization', 'Basic ' + btoa(username + " " + password));
xhr.send('"query":"hi"');
Run Code Online (Sandbox Code Playgroud)

javascript java jquery cors ibm-watson

3
推荐指数
1
解决办法
1717
查看次数

No Access-Control-Allow-Origin error in Meteor app

I added CORS extension to chrome. When called ajax from localhost I got response in the form of XML. If I disabled CORS extension I got the following error. I referred so many questions in this community. But I cant't resolve my problem. It may duplicate but I'm asking this question for help with hope.

XMLHttpRequest cannot load https://buzz.machaao.com/feed. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' …

javascript http localhost cors meteor

3
推荐指数
1
解决办法
973
查看次数

是否有比 w3c 验证器更好的 html 标准验证方法?

当然,这是一个非常通用的问题,但我想知道 w3c 验证是否被认为是 html 验证的最佳实践,或者是否有更好的方法来确保符合当代标准的标记。

当我注意到MDN 页面上的重复 ID 时出现了这个问题(我认为该网站对其编码实践非常严格)。这似乎是他们如何生成页面部分的人工制品。

奇怪的是,我在 w3c 验证器上验证了页面的代码,并且有各种“错误”表明 MDN 只是忽略了某个属性或值无效。通常,这些与rel属性的看似适当的使用有关。

我想知道有效的语义标记标准是否更重要,或者是否有一种新的理想方法来进行代码验证和标准化,而不是依赖 w3c 验证。

html semantic-markup w3c-validation

3
推荐指数
1
解决办法
855
查看次数

API服务器始终响应“否'Access-Control-Allow-Origin'”

我用laravel写后端。并尝试从IONIC使用中调用api @angular/http。

在后端服务器中,我已经添加Access-Control-Allow-Origin了中间件和响应。

中间件。

return $next($request)
      ->header('Access-Control-Allow-Origin', '*')
      ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE')
      ->header('Access-Control-Allow-Credentials', true)
      ->header('Access-Control-Allow-Headers', 'Content-Type')
      ->header('Vary', 'Origin');
Run Code Online (Sandbox Code Playgroud)

响应。

return response($data, 200)
      ->withHeaders([
        'Content-Type' => 'application/json',
        'Access-Control-Allow-Origin' => '*',
        'Access-Control-Allow-Methods' => 'GET, POST, PUT, DELETE',
        'Access-Control-Allow-Credentials' => true,
        'Access-Control-Allow-Headers' => 'Content-Type',
        'Vary' => 'Origin',
      ]);
Run Code Online (Sandbox Code Playgroud)

离子

  url: any = 'http://myurl.local/api/';

  headers = new Headers(
  {
    'Accept' : 'application/json',
    'Content-Type' : 'application/json',
    'Access-Control-Request-Methods' : 'POST'
  });
  options = new RequestOptions({ headers: this.headers });

login(username, password) {
    let …
Run Code Online (Sandbox Code Playgroud)

cors laravel ionic-framework laravel-5.4 ionic3

3
推荐指数
1
解决办法
4123
查看次数

获取 API 默认跨域行为

该取规格说的默认获取模式是“无CORS” -

请求具有关联的模式,即“同源”、“cors”、“no-cors”、“导航”或“websocket”。除非另有说明,否则它是“no-cors”。

但是,我似乎注意到了mode: 'no-cors'与未指定模式之间的这种行为差异。如此JSFiddle 示例中所示,将模式显式定义为“no-cors”会使 Javascript 无法访问响应,而未指定模式会使 Response 对象可用于调用方法。

显式指定获取模式的工作方式与内部使用相同模式的默认行为是否不同?我在这里缺少什么?

javascript fetch cors fetch-api

3
推荐指数
1
解决办法
1830
查看次数

从浏览器中运行的前端 JavaScript 代码调用 Yelp API

非常感谢任何人的帮助。我对 React 开发还比较陌生,使用 Mac OSX 和 Chrome 作为浏览器。我有一个小型应用程序,尝试使用“isomorphic-fetch”从 Yelp Fusion 的 API 发出异步 GET 请求,但收到以下错误:

Fetch API 无法加载https://api.yelp.com/v3/businesses/search?[剩余 URL]对预检请求的响应未通过访问控制检查:请求的资源上不存在“Access-Control-Allow-Origin”标头。因此,不允许访问来源“ http://localhost:3000 ”。响应的 HTTP 状态代码为 500。如果不透明响应满足您的需求,请将请求的模式设置为“no-cors”以在禁用 CORS 的情况下获取资源。

我做了很多搜索,看看已经存在对相同问题的回应,但我对如何用我对这种开发环境相对较新的知识来解决我的问题感到更加困惑。(似乎特别有用的答案是:对预检请求的响应未通过访问控制检查和在 componentDidMount 内部使用 HTTP 授权标头的 API 请求,但我并不真正了解如何在我的环境中实际实现这些解决方案。我所做的任何尝试看起来不正确并且不会导致更改。)。

附带说明:我已经在 Chrome 浏览器上安装了 Allow-Control-Allow-Origin: * 扩展程序,但我收到了相同的错误 - 只是对其进行了简短、不太详细的描述:

Fetch API 无法加载https://api.yelp.com/v3/businesses/search?[剩余网址]。预检响应具有无效的 HTTP 状态代码 500

以下是我在代码中调用 fetch 的方式:

var options = (
    method: 'get',
    headers: new Headers({
        'Access-Control-Allow-Origin': '*',
        'Authorization': [my token]
        'Content-Type': 'application/json'
    }) …
Run Code Online (Sandbox Code Playgroud)

javascript cors reactjs redux fetch-api

3
推荐指数
1
解决办法
8629
查看次数

为什么 Fetch API 调用不返回响应标头?

我正在构建一个注册表单,并有以下 API 调用来发布表单:

const request = new Request('http://localhost:4300/auth/', {
 method: 'POST',
 headers: new Headers({
   'Accept'       : 'application/json',
   'Content-Type' : 'application/json',
 }),
 body: JSON.stringify({ user: data })
});

fetch(request).then(response => {
    console.log(response);
    const auth = response.headers.get('Authorization');
    console.log(auth)
});
Run Code Online (Sandbox Code Playgroud)

问题是response.headers.get('Authorization')作为null. 即使我查看 Chrome 的 Network XHR 请求,我也会看到 API 服务器发送的响应标头。

为什么 React 没有response.headers通过上面的请求向我提供?

谢谢

javascript fetch cors reactjs fetch-api

3
推荐指数
1
解决办法
4140
查看次数

带有标头的基本身份验证 - Javascript XMLHttpRequest

我正在尝试访问需要基本身份验证凭据的 Adyen 测试 API。https://docs.adyen.com/developers/ecommerce-integration

我的凭据在通过浏览器访问 API 页面时有效。
验证

但是在尝试使用 XMLHttpRequest POST 请求访问 API 时,我收到了401 Unauthorized响应。

Javascript代码

var url = "https://pal-test.adyen.com/pal/servlet/Payment/v25/authorise";

var username = "ws@Company.CompanyName";
var password = "J}5fJ6+?e6&lh/Zb0>r5y2W5t";
var base64Credentials = btoa(username+":"+password);

var xhttp = new XMLHttpRequest();
xhttp.open("POST", url, true);
xhttp.setRequestHeader("content-type", "application/json");
xhttp.setRequestHeader("Authorization", "Basic " + base64Credentials);

var requestParams = XXXXXXXX;
xhttp.send(requestParams);
Run Code Online (Sandbox Code Playgroud)


结果

结果

javascript xmlhttprequest basic-authentication cors adyen

3
推荐指数
2
解决办法
7214
查看次数

React JS Fetch返回空响应但Postman不返回

我有一个React JS应用程序试图登录基于令牌的API(我也在开发,使用Laravel 5.5和Laravel Passport).我正在尝试实现基本登录(使用用户名和密码登录,一旦验证就从服务器接收令牌,使用该令牌进行将来的查询).

我用来获取的代码如下:

function loginApi(username, password) {
    return fetch(loginUrl, {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
        },
        body: JSON.stringify({
            grant_type: 'password',
            client_id: clientId,
            client_secret: clientSecret,
            username: username,
            password: password
        })

   }).then(handleApiErrors)
     .then(response => response.json)
}
Run Code Online (Sandbox Code Playgroud)

值得注意的是,它还没有完全完成,因为我目前只是想确定我要回复的反应.

我已经解决了遇到的正常问题,比如CORS问题,但是我现在遇到的问题是来自API的响应只是......空的.即使在Chrome的开发人员工具的"网络"标签中,如果我直接检查请求,则响应为空.

开发工具1

开发工具2

但是,如果我做了确切的相同与邮差查询,结果正是我所期望的.

邮差

这可能是什么问题?为什么完全相同的查询会返回不同的结果?

post promise laravel reactjs fetch-api

3
推荐指数
1
解决办法
1848
查看次数