GetStyleDescriptorCommand: Access to fetch at 'https://maps.geo.{region}.amazonaws.com/v2/styles/Satellite/descriptor?key={MyKey}' from origin has been blocked by CORS policy #7460
Description
Checkboxes for prior research
- I've gone through Developer Guide and API reference
- I've checked AWS Forums and StackOverflow.
- I've searched for previous similar issues and didn't find any solution.
Describe the bug
I am getting the following error:
Access to fetch at 'https://maps.geo.{Region}.amazonaws.com/v2/styles/Satellite/descriptor?key={API-KEY-Removed}' from origin 'http://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.
for the following code:
import { withAPIKey } from "@aws/amazon-location-utilities-auth-helper"; import { ColorScheme, GeoMapsClient, GeoMapsClientConfig, GetStyleDescriptorCommand, GetStyleDescriptorCommandInput, MapStyle } from "@aws-sdk/client-geo-maps"; try { const authHelper = await withAPIKey("API-Key-Here"); const config = authHelper.getClientConfig(); const client = new GeoMapsClient({ ...config, region: "Region-Here" }); const styleInput = { Style: "Satellite" as MapStyle }; const command = new GetStyleDescriptorCommand(styleInput); const response = await client?.send(command); if (!response) { throw new Error("Failed to fetch style descriptor: response is undefined."); } return response; } catch (error) { throw new Error(`Failed to fetch style descriptor: ${error}`); }Regression Issue
- Select this option if this issue appears to be a regression.
SDK version number
@aws-sdk/package-name@version, ...
Which JavaScript Runtime is this issue in?
Node.js
Details of the browser/Node.js/ReactNative version
v22.18.0
Reproduction Steps
Run this code in react app: try { const authHelper = await withAPIKey("API-Key-Here"); const config = authHelper.getClientConfig(); const client = new GeoMapsClient({ ...config, region: "Region-Here" }); const styleInput = { Style: "Satellite" as MapStyle }; const command = new GetStyleDescriptorCommand(styleInput); const response = await client?.send(command); if (!response) { throw new Error("Failed to fetch style descriptor: response is undefined."); } return response; } catch (error) { throw new Error(`Failed to fetch style descriptor: ${error}`); }Observed Behavior
Access to fetch at 'https://maps.geo.{Region}.amazonaws.com/v2/styles/Satellite/descriptor?key={API-KEY-Removed}' from origin 'http://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.
Expected Behavior
Should get Style descriptor in response in this line: const response = await client?.send(command);
Possible Solution
No response
Additional Information/Context
No response