Client-Side Authentication for Squarespace, Wix, Webflow and Others

A customer needed client-side authentication due to limitations in the hosting platform they were using since many platforms like Squarespace, Wix and Webflow do not support server-side code, and others like Salesforce CMS, Shopify and HubSpot CMS do but it’s very limited and you may need some serverless function to integrate with third-party services that require authentication.

Before we jump into client-side authentication, let’s take a look at how ZipCodeAPI authentication works.

ZipCodeAPI users get an API key.  This key can be used on the server side to make API calls.  Since the key is only on the server, nobody visiting the website sees the key.  We don’t allow this API key to be used on the client side in JavaScript, since then the API key would be visible in the HTML or JavaScript that the browser downloads to render the page.  So a malicious user could steal the API key and start making API keys themselves and steal the requests/second that were intended for the API key.

In Client-Side access authentication, instead of using the API key, the ZipCodeAPI user gets a JavaScript client key.  This client key has a list of domains that it’s valid for. The browser will automatically send the domain in the API requests made which is checked to see if it matches and is rejected if the API request doesn’t match (using CORS headers).

Back to this customer, because of their need for client-side authentication, they found ZipCodeAPI.

Client-side access authentication allowed us to develop our solution in a platform where server code execution was extremely limited.