Question

我的应用程序使用IBM Watson Speech-to-Text，这需要访问令牌。从命令行我可以使用curl获取访问令牌：

curl -X GET --user my-user-account:password \
--output token \
"https://stream.watsonplatform.net/authorization/api/v1/token?url=https://stream.watsonplatform.net/speech-to-text/api"

当我使用Angular的$http服务发出HTTP请求时，我收到一条CORS错误：

var data = {
  user: 'my-user-account:password',
  output: 'token'
};

$http({
    method: 'GET',
    url: 'https://stream.watsonplatform.net/authorization/api/v1/token?url=https://stream.watsonplatform.net/speech-to-text/api',
    data: data,
}).then(function successCallback(response) {
  console.log("HTTP GET successful");
}, function errorCallback(response) {
  console.log("HTTP GET failed");
});

错误消息显示：

请求时没有'Access-Control-Allow-Origin'标头资源。因此不允许来源“http://127.0.0.1:8080” 访问。响应的HTTP状态代码为401。

据我了解，不可能从Angular做CORS; CORS必须从服务器完成。我知道如何使用Node进行CORS，但我使用Firebase作为服务器。

Firebase有documentation关于使用CORS发出HTTP请求。文档说写这个：

$scope.getIBMToken = functions.https.onRequest((req, res) => {
  cors(req, res, () => {

  });
});

首先，这不起作用。错误消息为functions is not defined。显然functions不在Firebase库中？我从index.html致电Firebase：

<script src="https://www.gstatic.com/firebasejs/4.3.0/firebase.js"></script>

我的控制器为$firebaseArray，$firebaseAuth和$firebaseStorage注入了依赖关系。我是否需要为$firebaseHttp或类似内容注入依赖项？

其次，如何指定方法（'GET'），URL和数据（我的帐户和密码）？

Answer 1

如果您想使用angular发送凭据，只需设置withCredentials=true即可。我也在使用CORS和Angular v4，对于你的HTTP头错误，你是对的。必须在服务器端添加标题Access-Control-Allow-Origin，检查您的api中是否有设置允许某些域名，网址，页面，因为google api具有此功能，因此请检查您获取令牌的位置应该有一些设置。

这是一个例子，我是如何用CORS调用API的，使用typescript：

broadcastPresense(clientId: string) {
    const headers = new Headers({'Content-Type':'application/json','withCredentials':'true'});
    return this.http.post('http://localhost/api.php',
    {
       'jsonrpc': '2.0',
       'method': 'somemethod',
       'params': {'client_id': clientId},
       'id': CommonClass.generateRandomString(16)
    },{headers: headers, withCredentials:true}).map(
        (res: Response) => {
           console.log(res);
           const data = res.json();
           console.log(data);
           if (data.error == null) {
               return data.result;
           } else if (data.error != null) {
              throw data.error;
           }
           throw data.error;
       }
   ).catch(
      (error) => {
         this.router.navigate(['/error',3],{queryParams: {desc:'Server error'}});
         return Observable.throw(error);
      }
   );
}

希望有所帮助：）

Answer 2

答案是使用Cloud Functions for Firebase，它可以从服务器运行节点功能。然后使用节点模块request从节点发送HTTP请求。

如何使用Firebase和Angular发送HTTP GET请求？

2 个答案: