Tokens or Cookies? Knack embed on Squarespace

July 12, 2023 Chris Bampton

Should you use Cookies or Tokens for your App Embed on Squarespace?

Knack is an online database that enables applications to be built quickly and offers multi user capability built in. We wrote about embedding Knack apps on Squarespace here

There is a small but important change that has happened in the way users are authenticated and it can create friction for users of your website and the Knack application.

Users of Squarespace can benefit from a Squarespace feature to make the embed work in a really slick way. This post explains the background, the options and the pros and cons of each approach and then explains how Squarespace can come to your rescue.

Background.

The Knack login process used Tokens that provided the method for logging into your embedded app. this was seamless and allowed users to remain in a website and log in in-situ. Recently this was changed by default to use Cookies. In fact, Knack now offers a choice between using Tokenised login and Cookie Login. This choice may require trade-offs as browsers continue to restrict how user sessions are stored.

Cookies

The Default choice is now Cookies

Cookies are regarded as best practice for secure systems. The downside is that many browsers restrict the use of cookies and even require specific permissions to be set to use them. This in turn can make it difficult for your users to log into you app. In practice, clicking ‘login, now opens a popup window to circumvent the 3rd party cookie settings, but the result is anything but smooth for the users of your app.

For those of you offering the app to clients this method also stops the notion of white lablelling and diaplys the knack URL, which may also be less than ideal

Cookies
- Sets a secure cookie by logging in with a popup, following security best-practices
- It’s becoming increasingly more common that browsers (including Chrome, Safari, and Firefox) will block third-party cookies by default. For this reason, we recommend you guide your embedded app users to update their browser settings to allow third-party cookies for your app if you choose to use this option.
- With the cookies login setting, the embedded app opens a new browser window to complete the authentication for the user logging in.
- For this option, users logging into your embedded app will be redirected to a consent screen to log in. White labeling, the option to conceal Knack’s name in the URL, is not available with this option.

How does this option work? When you log in to your Knack app, a text file with unique data called a cookie is stored within in your browser. The data contained within it that cookie is a unique identifier of you and your computer that tells the app what data to share specific to you. To put it another way, think of your browser as a pantry, where each website you visit has its own cookie jar. The cookie jar can have two classifications of cookies: First-Party Cookies are stored by the domain you’re visiting directly Third-Party Cookies are stored by domains other than the one you’re currently visiting When you embed your Knack app into your website, your website is the first-party, and the Knack app is considered third-party. It was common practice for third-party cookies to be stored in your website’s cookie jar. However, third-party cookies are also commonly used for traffic tracking and other advertising-related activities so browsers have prevented this practice by default in a move towards improving privacy on the web. In order to authenticate the user, a consent screen is now required in order to allow our cookie to live in your website’s cookie jar. The consent screen must show the browser’s address bar and the domain must be the authenticating domain (Knack.com) so it cannot be white-labeled. This is the same experience you may already be used to if you log in to websites using a Google or Facebook account. To use this option, select the Cookies option for the Embedded Login Security in the User Settings of your app.

Knack Technical support

Tokens

The token security model uses refresh tokens to act like a normal login, but has some security vulnerabilities to be aware of

This option is less secure than using Cookies

With the tokens login setting, the embedded app uses a normal Knack login form. For this option, users logging into your embedded app will not be redirected to a consent screen to log in and can log in directly through the embedded app.

How does this option work?

When you log in to a website, this option stores tokens in the browser. These tokens can then be used to authenticate the user logging into your app.

To use this option, select the Tokens option for the Embedded Login Security in the User Settings of your app.

Understanding Security Risks

Tokens are recommended when you have full control over every computer that could potentially access your app and can ensure they’re only using trusted browser extensions. so for internal company intranets for example. For example, you could use the IP whitelisting option to ensure only users located at a specific IP address are accessing your app. This of course wont work if users are on dynmic IP address or are accessing the website via a VPN which can create false IP addresses.

This option goes against security best practices because using tokens can be prone to Cross-Site Request Forgery (CSRF). This makes it possible for a third party to gain access to the token value and log in using the user’s token without permission from the user. For example, an unwanted script could run on your page, scan your browser’s storage, copy the token value, and impersonate the user using the copied token value.

Squarespace SolutionS

Built in features of Squarespace can help improve the security of using tokens and make your app both more secure and much more pleasant for your users. This is acheived by using both Squarespace security checks and those built into your app.

All of the relative merits of Cookies vs Tokens are true on open pages - that is to say pages that anyone with a URL can access. Squarespace however offers tow additional features that help to secure your app.

Password Lock your Squarespace page where the app is embedded.
Setting a password on the page that hosts the app will prevent the page being visible for everyone - but will make the page much more secure. Visitors will only be able to access the login screen if they know the password for the page. There can only be one password for the page, and this is shared to users of the app, and they would then login to the app to identify themselves specifically.
Harness Squarespace Member Areas
Squarespace Member areas enables each user to have their own login to areas of the website that you control and grant access to.

Conclusion.

Embedding your application on Squarespace presents both opportunities and potential risks. As soon as you enable more than one person to access your database application, your risk increases. The skill is to balance to risk of one problem against the risk of another. For example you may feel that the risk of your application being hacked is lower than the risk of no-one using it…!

What is the motivation and potential benefit of a skilled person attempting to access your data, versus the problems of potentially preventing wider access and creating browser issues with cookie settings in browsers?

The answer to this will be as individual as your organisation.

We feel the compromise of improving Token security by combining it with some Squarespace security might be the perfect solution for many Knack app users and it’s the one we use ourselves and for our clients.

If you’d like to know more about this approach, or anything else related to Knack database,
please contact Isoblue and ask to speak to Chris,
or email him directly chris@isoblue.com