Sign in with LiveChat

<!-- Start of LiveChat (www.livechat.com) code -->
<script>
    window.__lc = window.__lc || {};
    window.__lc.license = 11069052;
    ;(function(n,t,c){function i(n){return e._h?e._h.apply(null,n):e._q.push(n)}var e={_q:[],_h:null,_v:"2.0",on:function(){i(["on",c.call(arguments)])},once:function(){i(["once",c.call(arguments)])},off:function(){i(["off",c.call(arguments)])},get:function(){if(!e._h)throw new Error("[LiveChatWidget] You can't use getters before load.");return i(["get",c.call(arguments)])},call:function(){i(["call",c.call(arguments)])},init:function(){var n=t.createElement("script");n.async=!0,n.type="text/javascript",n.src="https://cdn.livechatinc.com/tracking.js",t.head.appendChild(n)}};!n.__lc.asyncInit&&e.init(),n.LiveChatWidget=n.LiveChatWidget||e}(window,document,[].slice))
</script>
<noscript><a href="https://www.livechat.com/chat-with/11069052/" rel="nofollow">Chat with us</a>, powered by <a href="https://www.livechat.com/?welcome" rel="noopener nofollow" target="_blank">LiveChat</a></noscript>
<!-- End of LiveChat code -->

npm install --save @livechat/accounts-sdk@^2.0.0

import AccountsSDK from '@livechat/accounts-sdk';

// javascript
const instance = new AccountsSDK({
  client_id: '<your_app_client_id>',
  redirect_uri: '<your_app_redirect_uri>'
});

document.getElementById('login-button').onclick = (e) => {
  if (e && e.preventDefault) {
    e.preventDefault();
  }

  instance.popup().authorize().then((authorizeData)=>{
    const transaction = instance.verify(authorizeData);
    if (transaction != null) {
      // authorization success
      // authorizeData contains `accessToken` or `code`
      // transaction contains state and optional code_verifier (code + PKCE)
      console.log("User access token: " + transaction.accessToken)
      document.getElementById('login-button').style.display = "none"
    } else {
      console.log("Redirect state don't matches previous one")
    }
  }).catch((e)=>{
    console.error("Failed to authorize user", e)
  })
};

const instance = new AccountsSDK({
  client_id: '<your_app_client_id>'
});

  const popup = instance.popup({
  client_id: '<your_app_client_id>'
});

  const redirect = instance.redirect({
  client_id: '<your_app_client_id>'
});

  const authURL = instance.authorizeURL({
  client_id: '<your_app_client_id>'
}, "token");

  const transactionData = instance.verify(authorizeData);
  if (transactionData) {
    console.log("Verified correctly");
  } else {
    console.log("Url/state mismatch");
  }

const instance = new AccountsSDK({
  client_id: '<your_app_client_id>'
});

const popup = new Popup(instance, instance.options);

  popup.authorize().then((authorizeData) => {
    console.log("authorize data acquired: " + authorizeData);
  }).catch(e => {
    console.error("Failed to acquire authorization data: " + e);
  });

const instance = new AccountsSDK({
  client_id: '<your_app_client_id>'
});

const redirect = new Redirect(instance, instance.options);

const redirect = instance.redirect();

  redirect.authorize();

  redirect.authorizeData().then((authorizeData) => {
    console.log("Authorization data acquired: " + authorizeData);
  }).catch(e => {
    console.error("Failed to acquire authorization data: " + e);
    redirect.authorize(); // Try to redirect user to authorization once more
  });

  const instance = new AccountsSDK({
    client_id: '<your_app_client_id>',
    redirect_uri: '<your_app_redirect_uri>',
    response_type: "code",
    pkce: {
      enabled: true
    }
  });

  instance.redirect().authorizeData().then((authorizeData) => {
    const transactionData = instance.verify(authorizeData);
    if (transactionData === null) {
      console.log("Failed to verify authorization data");
      return;
    }
    fetch(instance.options.server_url + "/v2/token", {
        headers: {
          'Accept': 'application/json',
          'Content-Type': 'application/json'
        },
        method: "POST",
        body: JSON.stringify({
          grant_type: "authorization_code",
          code: authorizeData.code,
          client_id: transactionData.client_id,
          redirect_uri: transactionData.redirect_uri,
          code_verifier: transactionData.code_verifier,
      })
    })
    .then((res) => { res.json()}).then((data) => {console.log("User tokens: " + data)})
    .catch((e) => { console.log("Failed to exchange code: " + e) })
  }).catch(e => {
    // As we don't have any authorization data, then we can try o authorize user
    const wasRedirected = sessionStorage.getItem('lc_accounts');
    if (wasRedirected === "yes") {
      console.error("Couldn't authorize user: " + e);
      return
    }
    sessionStorage.setItem('lc_accounts', yes);
    instance.redirect().authorize(); // Initiate authorization redirect flow

  })