I’m trying to make calls to the Hubspot API using JavaScript fetch requests, but I keep getting a CORS error in my browser’s developer tools.
The error message I see is:
Access to fetch at 'https://api.hubapi.com/contacts/v1/lists/all/contacts/all?hapikey=mykey' from origin 'https://mysite.hs-sites.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Is there a way to configure the Access-Control-Allow-Origin header for Hubspot API requests? If that’s not possible, what are some alternative approaches I can use to integrate with their API? I need to fetch contact data and display it on my website.
Any help would be appreciated since I’m stuck on this CORS problem and can’t move forward with my integration.
HubSpot blocks client-side API calls because of CORS - hit the same wall last year building a contact dashboard. They don’t want API keys exposed in frontend code, which makes sense security-wise. I solved it by moving the API calls to my backend (PHP in my case, but Node.js works too). Just create your own endpoint that talks to HubSpot, then call that from your frontend instead. There’s also HubSpot’s JavaScript SDK if you’re in their CMS, but for external sites you’ll need that backend proxy setup.
Hit this same issue building a client portal. HubSpot blocks direct browser requests on purpose - they don’t want API keys exposed. I solved it with AWS Lambda as a middleware layer. Each Lambda function hits specific HubSpot endpoints and sends clean data back to the frontend. Keeps your API keys safe on the server side but you still get real-time data. Lambda’s cheap if you’re not making tons of calls, and it’s way easier to deploy than running a full backend server.
totally! CORS can be a pain. using a server as a proxy is a good move. personally, i set up an express server to route my requests to the HubSpot API. makes it smoother for fetching data. hope that helps!