Question

我正在使用Ajax调用Google的Vision API。我已完成结算并收到了API密钥。但是一旦实现，我就会遇到这样的错误：

＆＃34;对预检请求的响应未通过访问控制检查：否＆＃39;访问控制 - 允许 - 来源＆＃39;标头出现在请求的资源上。起源＆＃39; null＆＃39;因此不允许访问。响应的HTTP状态代码为403。＆＃34;

我尝试使用我在网上找到的解决方案，例如将请求标头设置为＆＃34; Access-Control-Allow-Origin：*＆＃34;并使用Chrome扩展程序。如果有人可以提供帮助，那将是非常好的。

var request = {     
    "requests": [{
              "image": {
                "content": url,
              },
              "features": [{
                  "type": "WEB_DETECTION",
                  "maxResults": 1
               }]
            }]
     }

$.ajax({
     method: 'POST',
     url: 'https://vision.googleapis.com/v1/images:annotate?key=' + key,
     contentType: 'application/json',
     data: JSON.stringify(request),
     processData: false,
     beforeSend: function(req) {
         req.setRequestHeader('Access-Control-Allow-Origin', '*');
         console.log(req);
     },
     success: function(data){
         console.log("Data: " + data);
         var webData = data.responses[0].webAnnotations[0];
         console.log("Web Data: " + webData);
     },
     error: function (data, textStatus, errorThrown) {
         console.log('error: ' + errorThrown);
     }
});

Answer 1

我将在这里的评论中总结讨论：

如果使用file://协议打开网站文件时进行跨域API调用，则API调用通常会被浏览器拒绝。为了避免这种情况，请尝试运行本地服务器并从那里访问它。

我通常使用npm包http-server

npm i -g http-server
cd /path/to/folder/with/static/files
http-server

您可以通过http://localhost:8080

访问您的网站

编辑：您需要安装NodeJS才能使用npm

如果您没有NodeJS，您也可以安装Apache或Nginx或XAMPP来做同样的事情。

还有一个名为Surge.sh的便捷服务，可让您轻松地将网站部署到surge.sh上的自定义子域。

Google Vision API调用的CORS问题

1 个答案: