--- title: "Streamlining SSO Authentication with Sleekplan Widget: A Browser-Based Approach — Sleekplan Journal | Sleekplan" canonical_url: "https://sleekplan.com/blog/streamlining-sso-authentication-with-sleekplan-widget-a-browser-based" last_updated: "2026-05-28T16:21:05.296Z" meta: description: "This blog post explores a method for implementing Single Sign-On (SSO) with the Sleekplan widget without generating the SSO key on the server. Instead, we create an SSO key directly on the client side using a JavaScript-based approach. While this technique offers speed and simplicity, it's important to note that it may not be the most secure SSO implementation." "og:description": "This blog post explores a method for implementing Single Sign-On (SSO) with the Sleekplan widget without generating the SSO key on the server. Instead, we create an SSO key directly on the client side using a JavaScript-based approach. While this technique offers speed and simplicity, it's important to note that it may not be the most secure SSO implementation." "og:title": "Streamlining SSO Authentication with Sleekplan Widget: A Browser-Based Approach — Sleekplan Journal | Sleekplan" --- ## The Browser-Based SSO Key To create an SSO key on the client side, we’ll leverage JavaScript and some basic cryptography techniques. Our approach involves generating a JSON Web Token (JWT), which can be used as the SSO key. Here’s a code example that demonstrates how to create a JWT SSO token in the client-side JavaScript: ``` \`\`\` In this code, we first include the CryptoJS library for cryptographic operations. Then, we define functions to perform base64 URL encoding and create a JWT SSO token. The createJWT function constructs the token using the specified header and user data. You should replace the secret with your own private key. This code sets the SSO token in the window.SLEEK_USER object before loading the Sleekplan SDK, ensuring that the token is available for authentication when the SDK initializes. When implementing this method, remember to: - Replace the __SLEEK_PRODUCT_ID__ with the correct Product ID for your Sleekplan workspace. - Replace the __secret__ with your own private key. Do not use the example secret provided in the code. ## A Note on Security It's important to emphasize that this approach may not be the most secure way to implement SSO. Generating the SSO key on the client side means that the secret key is exposed to potential security risks. If security is a top priority, it's recommended to stick with server-based SSO key generation, which can provide better protection for sensitive keys. However, in cases where speed and simplicity are more important than security concerns, this browser-based method can be a quick and convenient way to enable SSO with the Sleekplan widget. Just be aware of the security trade-offs and use it judiciously according to your specific needs. Remember to adjust the code to your specific use case and replace the example secret with a more secure implementation. Always prioritize security when dealing with sensitive user data. ``` Mmarco·Oct 17, 2023 More from the Journal [GuidesMar 3, 20261 min Skip Sleekplan widget login for anonymous surveys→](https://sleekplan.com/blog/skip-sleekplan-widget-login-for-anonymous-surveys-4167) [GuidesAug 26, 20255 min How to add CSS to the Sleekplan widget: safely access iframe CSS and style it cleanly→](https://sleekplan.com/blog/how-to-add-css-to-the-sleekplan-widget-safely-access-iframe-css-and-style-it) [GuidesJul 22, 20232 min How to Make the Native Sleekplan Feedback Button Movable→](https://sleekplan.com/blog/how-to-make-the-native-sleekplan-feedback-button-movable) Keep up ## New essays land on LinkedIn every Tuesday. Follow Sleekplan on LinkedIn — we post every new piece there, plus the shorter notes that never make it to the journal. [Follow on LinkedIn](https://www.linkedin.com/company/sleekplan/) Done reading? [Try Sleekplan free ](https://sleekplan.com/sign-up)