Getting HubSpot chat widget to work in Electron application

Other Questions HubSpot
1

I’m having trouble getting the HubSpot chat widget to display properly in my Electron application. The chat bubble simply won’t appear even though the script loads correctly.

Here’s my basic HTML structure:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>My App</title>
    </head>
    <body>
        <h1>Welcome to my app</h1>
        <script type="text/javascript" id="hs-script-loader" async defer src="https://js.hs-scripts.com/123456.js"></script>
    </body>
</html>

The issue seems to be that Electron doesn’t serve files through a traditional web server. When I test the same HTML file by opening it directly in Chrome using the file protocol, the chat widget doesn’t show up there either.

I can see in the network tab that the HubSpot script is being downloaded successfully, but the chat interface never renders. Has anyone successfully implemented HubSpot chat in an Electron app? What configuration changes are needed to make this work?

2

i had this issue too! hubspot needs a secure context, so you might wanna try running a local server like http-server. also, check the webPreferences in your BrowserWindow to allow insecure content. just remember, it’s a quick fix!

3

HubSpot’s chat widget needs proper origin headers and HTTPS to work. Electron’s file protocol doesn’t meet these security requirements. I hit this same issue last year building a desktop app for our support team. Here’s what fixed it: set nodeIntegration to false and contextIsolation to true in webPreferences, then run Express inside the Electron process. This gives you a proper HTTP context that HubSpot accepts. Bind Express to localhost on any open port and load that URL in your BrowserWindow instead of loading the HTML file directly. If the widget keeps fighting with Electron’s security model, you could also use HubSpot’s API to build your own chat interface.