# Widgets SSO

## What is Single Sign-On

If you have accounts of your users in your system - you can effectively provide this data to the widget using a JSON Web Token generated on your server to authenticate widget users. This mechanism is called Single Sign-On.

{% hint style="warning" %}
This is the preferred way of securing your widgets from unauthorized access and irrelevant feedback. You should **turn on the "*****Allow only protected requests*****" option** in the **Products -> %Productname% -> Widgets** tab in your ProdCamp workspace. This will ensure that only token-authorized requests will be allowed from your widgets and won't give you a chance to send any spam or irrelevant feedback.
{% endhint %}

## How do I set it up?

The process of generation of a token is the same as described [in this article](/roadmaps/single-sign-on.md#how-to-generate-a-token). For instance - the same token can be used to authenticate a user on your public roadmap automatically by providing him a link to your public roadmap with a pre-filled "**token**" query parameter (this way user will be automatically authenticated on your public roadmap and won't have to sign up himself).

## How do I pass the generated token inside widgets?

There is a bunch of ways of how you can do it:

#### 1. Set up initialization parameters before the widget SDK generated script code.

```javascript
<script>
    window.ProdCampSettings = {
        token: '{your_generated_token}' 
    };
</script>

<!-- Widgets SDK code -->
<script>!function(t,e,a,n){function o(){if(!e.getElementById(a)){var t=e.getElementsByTagName(n)[0],o=e.createElement(n);o.type="text/javascript",o.async=!0,o.src="https://cdn.prodcamp.com/js/prdcmp-sdk.js",t.parentNode.insertBefore(o,t)}}if("function"!=typeof t.ProdCamp){var c=function(){c.args.push(arguments)};c.p="{product_id}",c.args=[],c.t=t.ProdCampSettings&&t.ProdCampSettings.token,c.f=true,t.ProdCamp=c,"complete"===e.readyState?o():t.attachEvent?t.attachEvent("onload",o):t.addEventListener("load",o,!1)}}(window,document,"prodcamp-js","script");</script>
<!-- /Widgets SDK code -->
```

####

#### 2. Use the ProdCamp SDK function

You can provide the token whenever you want using a special **ProdCamp** SDK function like this:

```javascript
ProdCamp('setToken', '{your_generated_token}');
```

####

#### 3. Async token generation function

When a user performs some action that requires to be authenticated (for example - send feedback), a special SDK method `ProdCamp.getToken` is being called. You should override this function by assigning one that requests a new token from your server each time the user performs an action. This function should have a callback argument that must be called when the new token is received from a server.

```javascript
ProdCamp.getToken = function( callback ) {
fetch('https://yourserver.com/get-sso-token/')
.then(response => response.json())
.then((data) => {
// get the token
let userToken = data.token;
// return the generated token to the widget
callback(user.Token);
});
};
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.prodcamp.com/widgets/widgets-sso.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.