Question

我正在跟踪Google Documentation以使用Vision API，但不幸的是，我继续遇到以下CORS错误：

Access to XMLHttpRequest at 'https://vision.googleapis.com/v1/images:annotate?key=MY_KEY_HERE' from origin 'https://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我正在做的是在 Vue 模板中进行的操作

：

    const googleRequestData = {
      requests: [
        {
          image: {
            content: base64Image
          },
          features: [
            {
              type: 'LABEL_DETECTION',
              maxResults: 10
            },
            {
              type: 'SAFE_SEARCH_DETECTION'
            }
          ]
        }
      ]
    }
    const gv = await this.$axios.$post(
      `https://vision.googleapis.com/v1/images:annotate?key=${
        process.env.googleApplicationCredentials
      }`,
      googleRequestData
    )
    console.log('google vision', gv)

这看起来很简单，但是我敢肯定，我缺少像往常一样没有得到充分证明的东西，所以我无法继续...

希望您能提供帮助！谢谢

Answer 1

您可以考虑look at Google Cloud docs，以允许您的域，以便向Vision Api发出跨源请求
第二，您可以从服务器（例如，node.js）发出请求，并通过该服务器提供Vue.js应用程序，并且可以在该服务器中向Vision API发出请求，以便可以使用该api使用Vue.js，因此不会被CORS阻止。 You can take a look at可以与Vue.js一起使用的后端

从Vue客户端调用谷歌视觉API

1 个答案: