Angular 标头 Web API答案

【问题标题】：Angular Headers Web APIAngular 标头 Web API
【发布时间】：2016-05-18 03:13:14
【问题描述】：

我正在尝试在每个 api 调用中添加 X-APIKeys 标头，但它们只有 curl 中的示例。我试过了：

 var accessKey = "gdgfdgdfgdgdgfdgdfgfdgfdgdgh";
 var secretKey = "ggdgfdgdggtet565645654654654";
 $http.get("/information",{
  headers:{ {"X-APIKeys": accessKey, secretKey}}
    )

我也尝试过为配置做一个拦截器：

 config.headers['X-ApiKeys'] = {accessKey, secretKey}

X-APIKeys 的结构是我认为引起问题的原因。我提供了他们正在寻找的 http 标头的图片。

完整的请求标头：

  Accept:*/*
  Accept-Encoding:gzip, deflate, sdch
  Accept-Language:en-US,en;q=0.8
  Access-Control-Request-Headers:accept, x-apikeys
  Access-Control-Request-Method:GET
  Connection:keep-alive
  Host:
  Origin:http://localhost:60531
  Referer:http://localhost:60531/
  User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.103 Safari/537.36

这是尝试 Tomislav 示例的请求标头：

【问题讨论】：

标签： javascript angularjs http http-headers

【解决方案1】：

试试这个：

$http.get("/information",{
    headers: { 'X-ApiKeys': 'accessKey=' + accessKey+'; secretKey='+secretKey+';' }})

【讨论】：

它给了我一个不允许的 405 方法。当我只做 $http.get("/information") 时，它会给我一个需要 401 授权。
我打错了 X-ApiKeys，现在编辑了我的答案。你能在 api 调用后给我们请求头吗，试试 google chrome 开发工具。
状态码：不允许使用 405 方法。我在问题中添加了请求标头的图片，并更改了拼写。
好的，但是你能不能给我们来自谷歌浏览器网络标签的完整请求头，就像这个 SO：stackoverflow.com/a/15599537/1703503
好的，我将它添加到问题中'

【解决方案2】：

你应该做一个拦截器，因为可能正在进行一些 CORS 协商（OPTIONS？）。这保证了所有请求都有标头。当然，如果只有对某个主机的请求应该有标头，那么您必须有一个 if 来决定是否包含。 Config 只是一项服务，您可以保留 api 键值。如果您不想这样做，只需对值进行硬编码即可。

'use strict';

var app = angular.module('App');

app.factory('apiKeyInterceptor', [function (Config) {

    var header = 'accessKey=' + Config.accessKey+'; secretKey='+ Config.secretKey+';'
    return {
      request: function (config) {
        config.headers = config.headers || {};

        config.headers['X-ApiKeys'] = header;
        return config;
      }
    };
  }]);

var app = angular.module('App', []).config(function($httpProvider) {
    $httpProvider.interceptors.push('apiKeyInterceptor');
}

还要小心检查它们是指 curl 命令中的 {} 字面意思还是占位符。

【讨论】：

我已经添加了您的建议，但我相信它仍然存在 CORS 问题。我会提出另一个问题，但似乎这很常见。我自己唯一的问题是我无法访问服务器，这使得他们的很多建议与我的情况无关。感谢您对问题的更新，它肯定有助于在每个请求上发送标头。