Skip to main content

​
Tenant embedding guide

This guide is for partner and tenant engineering teams embedding Narrative SDK UI into an existing web app.

​
Required configuration

  • NSDK_BASE_URL: hosted SDK frontend base URL
  • NSDK_CONNECTED_APP_CLIENT_ID: connected app client id
  • NSDK_CONNECTED_APP_SECRET_KEY: connected app secret key (backend only)
1

Load the SDK loader

Loader script
<script>
  (function (w, d, s, u, n) {
    w[n] = w[n] || function () {
      ;(w[n].q = w[n].q || []).push(arguments)
    }
    var js = d.createElement(s)
    js.async = true
    js.src = u
    d.head.appendChild(js)
  })(window, document, 'script', '<NSDK_BASE_URL>/nsdk-loader.js', 'NSDK')
</script>
2

Add a widget container

<div id="nsdk-container" data-nsdk="true" data-nsdk-widget="insights"></div>
3

Fetch and set Embed Token

Browser
const { embed_token } = await fetch('/your-embed-token-endpoint').then((r) => r.json())
const container = document.getElementById('nsdk-container')
container?.setAttribute('data-nsdk-token', embed_token)

​
Token standard

  • JWT, HS256
  • aud must be nsdk-embed
  • TTL recommended: 5-15 minutes
  • Required claims: iss, sub, aud, iat, exp, jti
  • Required fields: nsdk.user.name, nsdk.user.email

​
Security checklist

Keep connected app secrets server-side only. Do not expose token signing logic in browser code.
  • Do not store Embed Tokens in browser local storage.
  • Use HTTPS and strict origin/CSP controls.
  • Validate user authorization before minting each token.

​
Optional imperative mode

Browser
NSDK('boot', {
  widgets: [{ type: 'insights' }],
  mount: '#nsdk-container',
  embedToken: '<EMBED_TOKEN>'
})

NSDK('destroy')