Angularjs google自定义搜索api的无效凭据错误消息

我正在使用google自定义搜索api在angular.js项目中搜索图像

这是我的密码：

 var photosPublic = $resource('https://www.googleapis.com/customsearch/v1',
      { key: '..........ZDtw95C0V98ne4S39SPFi68', cx: '..........75325342:1ttvll7gahc' },
      { searchType:'image' });
    return {
      search: function(query) {
        var q = $q.defer();
        photosPublic.get({
          q: query
        }, function(resp) {
          q.resolve(resp);
        }, function(err) {
          console.log(err);
          q.reject(err);
        })

        return q.promise;
      }
    }

若我直接在浏览器中输入url和所有凭证，那个么它就可以正常工作。但当我将其纳入我的项目时，我收到了以下回复：

 {
    "error": {
    "errors": [
       {
       "domain": "global",
       "reason": "authError",
       "message": "Invalid Credentials",
       "locationType": "header",
       "location": "Authorization"
       }
      ],
   "code": 401,
   "message": "Invalid Credentials"
  }
}

---

我做错了什么？

我也有同样的问题，我想在这里分享我的解决方案，因为我是在谷歌搜索中绊倒的

当您在请求库（如

$resource

或

axios

等）中设置一些默认授权头时，就会出现问题

当您在发送给google custom search api的请求中提供授权标头时，google服务器正试图使用此标头对您进行授权，甚至没有尝试使用给定的

键

和

cx

对您进行授权

我对$resource了解不多（也许其他人可以添加一些代码？），但我有一个针对axios的解决方案：

import axios from 'axios'

export default {
    url: 'https://www.googleapis.com/customsearch/v1',
    http: axios.create(),
    search(text) {
        this.http.defaults.headers.common = {};
        const key = process.env.GOOGLE_SEARCH_API_KEY
        const cx = process.env.GOOGLE_SEARCH_SCOPE_ID
        return this.http.get(this.url, {
            params: {
                q: text,
                cx,
                key
            }
        })
    }
}

---

这将为搜索api创建自己的axios实例并重置头。另外：您的全局axios实例不受影响（可能需要您的Auth头才能与后端通信）。

我也遇到了同样的问题，希望在这里分享我的解决方案，因为我在谷歌搜索中遇到了问题

当您在请求库（如

$resource

或

axios

等）中设置一些默认授权头时，就会出现问题

当您在发送给google custom search api的请求中提供授权标头时，google服务器正试图使用此标头对您进行授权，甚至没有尝试使用给定的

键

和

cx

对您进行授权

我对$resource了解不多（也许其他人可以添加一些代码？），但我有一个针对axios的解决方案：

import axios from 'axios'

export default {
    url: 'https://www.googleapis.com/customsearch/v1',
    http: axios.create(),
    search(text) {
        this.http.defaults.headers.common = {};
        const key = process.env.GOOGLE_SEARCH_API_KEY
        const cx = process.env.GOOGLE_SEARCH_SCOPE_ID
        return this.http.get(this.url, {
            params: {
                q: text,
                cx,
                key
            }
        })
    }
}

---

这将为搜索api创建自己的axios实例并重置头。另外：您的全局axios实例不受影响（可能需要您的Auth头才能与后端通信）。

您能记录Angular创建的URL吗？我也有同样的问题。请注意，

$q.defer

在这里是一种反模式，因为您可以返回

resource.get（）。$promise

我通过从服务器访问api而不是直接从客户端调用它来解决这个问题。我不确定它是不是应该这样。你能记录Angular创建的URL吗？我也有同样的问题。请注意，

$q.defer

在这里是一种反模式，因为您可以返回

resource.get（）。$promise

我通过从服务器访问api而不是直接从客户端调用它来解决这个问题。我不确定这是不是应该是这样的。