Recently I tried to make a very simple UI Extension with HubSpot. What I want to acheive is to make an API request to a third party API and fetch some data and present it in my card.
But the problem is the card is rendering in browser, and as any developer knows, browswer blocks the request due to Content Security Policy (CSP).
As I could predict I received this error in browser console:
Refused to connect to 'MY API Endpoint' because it violates the following Content Security Policy directive: "connect-src none".
So now, my question is what can we do? What practice should we exactly follow if we want to connect our HubSpot UI Extension to the other third parties API since in "development phase" usually there should be a easy way to bypass browswer!
FYI, in my local node.js applicatoin I usually use a public "cors proxy" to overcome this!
As per HubSpot docs, you'll want to manage all external API calls via "Serverless Functions". This way, the requests should be handled in your HubSpot UI Extension backend. In this case, I don't imagine you'd run into any CORS related errors.
I hope that proves helpful. Please let me know if you have any follow-up questions.
All the best,
Zach
--
Zach Klein HubSpot Integrations & App Developer Meanjin / Brisbane, Australia
As per HubSpot docs, you'll want to manage all external API calls via "Serverless Functions". This way, the requests should be handled in your HubSpot UI Extension backend. In this case, I don't imagine you'd run into any CORS related errors.
I hope that proves helpful. Please let me know if you have any follow-up questions.
All the best,
Zach
--
Zach Klein HubSpot Integrations & App Developer Meanjin / Brisbane, Australia