Logo
ХелпдескУправление знаниямиБизнесуТарифыЧто такое KCS?Блог
Русский
Личный кабинет
Настройка системы
© 2023 - 2026 ООО «Свормика». Swarmica - Платформа управления знаниями и ресурсами техподдержки. Версия: 6.1.2

#1145: Embedding and authorizing a web widget in your own application

Отредактирована: сегодня

Integrating an external system and quick login

Please read the overview of the integration logic described in the article first (https://support.swarmica.com/article/ru/557-ru.html).

IMPORTANT: This document provides examples of OTP_CODE_KEY and API key.

When going to production, you will need to change the cipher (OTP_CODE_KEY) and API key used for integration.

System setup (once/as needed)

Setting up the system, both Swarmica and the external system being integrated (your application), is done once (or reconfigured as needed).

On the Swarmica side:

  1. On the server: You need to set up a secret key for the cipher and the maximum allowed time deviation in the timestamp and connect the authorization provider code: To do this, set the variables in /root/swarmica/.env:
root@swarmica# grep -i code .env
AUTH_PROVIDERS=email,code
OTP_CODE_KEY=E655633B-2FAB-4661-9637-EXAMPLE
OTP_CODE_TIMESTAMP_DELTA=120

The parameter OTP_CODE_TIMESTAMP_DELTA is the lifespan of the generated link for user authorization in seconds. For example and testing, this parameter is set to 120 seconds; for production, it is recommended to set it to a few seconds (5-10).

The parameter OTP_CODE_KEY is a secret key used for encrypting/decrypting authorization data. After completing the development, it is recommended to replace the key.

Restart the system:

cd /root/swarmica
docker compose down
docker compose up -d
  1. In the Swarmica app (Administrator rights required): Create an API key that will be used by the backend of the integrated system in Settings > API Integration. It will look like this: EXAMPLE-cdc6-4be4-a31d-1cf0aa129b99

On the side of the integrated system (billing or panel):

  1. Prepare the code to work with the Swarmica API.
  2. Write down in configurable variables:
    • Code for the cipher (same as OTP_CODE_KEY above): E655633B-2FAB-4661-9637-EXAMPLE
    • API key: EXAMPLE-cdc6-4be4-a31d-1cf0aa129b99
    • Template HTML code for embedding the widget with OTP settings https://support.swarmica.com/article/ru/599-vstraivaemyj-veb-vidzhet.html

Example widget code:

<!-- start embedded Swarmica widget script -->
<iframe src="https://support.yourdomain.tld/widgets/index.html?id=veNilW0QFQhTq2hg&locale=en&otpdata=URLENCODED_ДАННЫЕ_СМ_ДАЛЕЕ" id="veNilW0QFQhTq2hg" style="position: fixed; right: 12px; bottom: 12px; width: 56px; height: 56px; overflow: hidden; "
  allowTransparency="true"
  frameborder="0"
  allowTransparency="true" frameborder="0"></iframe>
<script src="https://support.yourdomain.tld/widgets/render.js"></script>
<script>
  const iframe = document.getElementById("veNilW0QFQhTq2hg")
  iframe.onload = () => {
    renderWidget("veNilW0QFQhTq2hg")
  }
</script>
<!-- end embedded Swarmica widget scripts -->

Receiving a code for the user (when registering / authorizing the user in your application)

...