Despite following the Google Documentation to utilize the Vision API, I am encountering a persistent CORS error:
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.In a Vue template, here is what I am trying to do:
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)
Although it seems straightforward, I am certain that I am overlooking something due to inadequate documentation. Any assistance would be greatly appreciated. Thank you!