06-own-token-server.html

<!doctype html>
<!--
  Starting the quote form with tokens from your own server instead of a key.
  Your server holds an API application's client id and secret (from the
  dashboard: Integrations, API applications) and never shows the secret to
  the browser. Any live product and journey of your organisation can be
  started this way.

  Your server swaps the client id and secret for a short-lived access token
  (see token-server.mjs, next to this page) and returns
  { access_token, expires_in } to the page. The form calls getToken again
  before the token runs out, and once after a 401.

  Replace the token address, YOUR_PRODUCT_SLUG and YOUR_JOURNEY_SLUG with your
  own values (the comments in the script say where to find them).
-->
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Quote form: your own token server</title>
</head>
<body>
  <h1>Your own token server</h1>

  <div id="quote"></div>

  <script src="https://js.subcontext.com/quoteform-latest.js"></script>
  <script>
    // Asks your server for a token. Return the token as a string, or { access_token, expires_in }.
    function getToken() {
      // Your own token endpoint, a route on your server like the one in token-server.mjs.
      // On the same website as this page, a relative address such as '/subcontext-token' works.
      // (Running token-server.mjs on your computer, it's 'http://localhost:8081/subcontext-token'.)
      return fetch('https://YOUR-SERVER.example.com/subcontext-token').then((response) => {
        if (!response.ok) throw new Error('Could not get a quote token (' + response.status + ')')
        return response.json()
      })
    }

    Subcontext.Quote.init({
      container: '#quote',
      // The product and journey to quote can be any live product and journey of your organisation.
      // Their slugs are shown on the product's page and the journey's page in the dashboard (Products).
      productSlug: 'YOUR_PRODUCT_SLUG',
      journeySlug: 'YOUR_JOURNEY_SLUG',
      getToken: getToken,
      onError: (error) => console.warn('quote form error', error.status, error.code, error.message)
    })
  </script>
</body>
</html>