Rozszerzenia i integracje na zamówienie

1. 1

   Usługa zewnętrzna backend

   Najlepsze rozwiązanie jest w przypadku ERP, sklepu internetowego, WMS, BI i podobnej synchronizacji. Token pozostaje na serwerze i dane przechodzą przez API i webhooki.

2. 2

   Panel z iframe'em szafki

   Budować regularną stronę HTML/JavaScript przy użyciu dowolnego ramy. SelSup wstawia ją w iframe; nie wykonuje kodu React w szafie.

3. 3

   Moduł SelSup

   Wymagane do głębokiego rynku lub integracji dostaw uczestniczących w wspólnych procesach tła SelSup.

Zachowaj token w menedżerze sekretów i zadzwoń do SelSup tylko z Twojego backend.

Oddzielić adapter SelSup, kolejkę pracy i model domeny. Zmiany umowy API pozostają wtedy odizolowane od reszty aplikacji.

W przypadku zmian wchodzących i wychodzącich użyj skrzynki do wysyłki.

SelSup webhook → inbox → domain worker → ERP/WMS
ERP/WMS change → outbox → SelSup API → reconciliation

Budować regularną stronę HTML/JavaScript przy użyciu dowolnego ramy. SelSup wstawia ją w iframe; nie wykonuje kodu React w szafie.

Wydostępny panel w oddzielnej stronie HTTPS, która nie dzieli domeny plików cookie z szafą. Otwórz integracje → Moje rozszerzenia → Dodaj rozszerzenie i wybierz nazwę, ikonę, adres URL, sekcję menu i pozycję. Zapisz prywatny panel bez uprawnień, a następnie włącz tylko potrzebne uprawnienia.

Integracja rynku obejmuje zwykle tokeny, karty, ceny, zapasy, zamówienia i aktualizacje stanu tła.

Moduł ten zmienia główny backend SelSup i następuje w procesie przeglądu, testowania, lokalizacji i uwalniania.

Konwertuj zewnętrzne awary API na stabilne wartości ApplicationError oraz odwołane lub nieważne tokeny zewnętrzne na AccessException zgodnie z zasadami projektu backend.

1. 1

   Utworz konto testowe

   Oddzielne tokeny testowe, magazyny, produkty i zamówienia z danych dotyczących produkcji klienta.

2. 2

   Dodaj możliwość obserwacji

   Śledź opóźnienia kolejki, błędy kodem, liczby prób ponownych i niezgodności w pojedynku.

3. 3

   Plan migracji umowy

   Wspierać stare pola podczas przejścia i wdrażać konsumentów przed wyłączeniem starego formatu.

4. 4

   Odłączenie dokumentu

   Użytkownicy muszą wiedzieć, jak odwołać token, usunąć węzeł internetowy i zatrzymać synchronizację bez utraty danych.

Wybierz stronę menu (MENU_PAGE), zakładkę karty produktu (PRODUCT_TAB) lub zakładnię zamówienia (XTECTOX). Sekcja menu i pozycja mają zastosowanie tylko do MENU_PAGE. Zakładki wymagają zapisywanej jednostki z identyfikatorem.

Użytkownik poda użytkownika.id i user.locale; Klient poda klient.id; ORGANIZATION poda dostępny nazwisko organizacji. PRODUCT przyznaje produkty.modelId na kartę produktu; ORDER przyznaje order.id na zamówienie. Wykluczone są pełne zapisy, kontakty, hasła i żetony.

{
  "type": "selsup.extension.context",
  "version": 1,
  "context": {
    "version": 1,
    "extensionId": "example-extension-id",
    "placement": "MENU_PAGE",
    "user": {"id": 101, "locale": "ru"},
    "client": {"id": 202},
    "organizations": [{"id": 303, "name": "Demo"}]
  }
}

[
  {
    "version": 1,
    "extensionId": "example",
    "placement": "PRODUCT_TAB",
    "apiMethods": [],
    "product": {
      "modelId": 404
    }
  },
  {
    "version": 1,
    "extensionId": "example",
    "placement": "ORDER_TAB",
    "apiMethods": [],
    "order": {
      "id": 505
    }
  }
]

Sprawdź dokładny element event.origin, event.source === window.parent, typ wiadomości, wersja i struktura. Wyślij gotowy na połączenie i kontekst żądania do odświeżenia. SelSup przepatruje dostęp i łączy częste żądanie. Nigdy nie przekazuj żetonów w adresach URL, panele localStorage lub wiadomościach.

const allowedOrigins = new Set(['https://your-cabinet.example.com']);
window.addEventListener('message', (event) => {
  if (event.source !== window.parent || !allowedOrigins.has(event.origin)) return;
  const message = event.data;
  if (!message || message.type !== 'selsup.extension.context' || message.version !== 1) return;
  const context = message.context;
  if (!context || context.version !== 1 || !['MENU_PAGE', 'PRODUCT_TAB', 'ORDER_TAB'].includes(context.placement)) return;
  // The complete sample also validates fields and strips unknown properties.
  document.querySelector('#context').textContent = JSON.stringify(context, null, 2);
});
for (const origin of allowedOrigins) {
  window.parent.postMessage({type: 'selsup.extension.ready', version: 1}, origin);
}
// Refresh after connecting: use the validated origin, never "*".
window.parent.postMessage({type: 'selsup.extension.request-context', version: 1},
  'https://your-cabinet.example.com');

W przypadku, gdy użytkownik instaluje system, w którym jest używany system, można uzyskać dostęp do danych, które są dostępne w systemie API.

Host powołuje tylko poniższe metody za pośrednictwem usług SelSupFront z uprawnieniami obecnych pracowników. Istniejące kontrole dostępu do serwera nadal obowiązują. ClientService i authService są całkowicie zabronione; wszystkie metody poza tą listą są również odrzucone. Aplikacje nie mogą dostarczać adresów URL, nagłówków, żetonów lub arbitralnej konfiguracji Axios. Serwer sprawdza bieżącą instalację i jej dotacje na rzeczywiste żądanie API.

Grant API niezależny od uprawnień kontekstowych. context.apiMethods zawiera listę przyznanych metod. Grant dotyczy metody w całym gabinetze w ramach dostępu pracownika, a nie tylko podmiotu w bieżącej karcie. Wyniki zawierają tylko udokumentowane pola, nigdy obiekty Axios lub uwierzytelnienia.

W przypadku błędów w serwisie host: ACCESS_DENIED, INVALID_REQUEST, RATE_LIMITED, EDUPLICATE_REQUEST, IFRAME4X.

tagService.findTags              {query?, page?, limit?}   => {rows: [{id, name}]}
tagService.createTag             {name}                   => {id, name}
tagService.updateTag             {id, name}               => {id, name}
tagService.deleteTag             {id}                     => null
productService.updateFavourite   {id, favourite}          => null

id: positive safe integer; updateFavourite.id = product.modelId
favourite: boolean
name: 1..100 characters (trimmed); query: 0..100 characters
page: 1..10000, default 1; limit: 1..100, default 30

{
  "type": "selsup.extension.api-request",
  "version": 1,
  "requestId": "request-1",
  "method": "tagService.createTag",
  "params": {
    "name": "Demo"
  }
}

{
  "type": "selsup.extension.api-response",
  "version": 1,
  "requestId": "request-1",
  "ok": true,
  "result": {
    "id": 1,
    "name": "Demo"
  }
}

// connection = connectExtension(...) from selsup-extension.js
// Run from a button click after receiving context.apiMethods.
const tag = await connection.callApi('tagService.createTag', {name: 'Demo'});
console.log(tag.id, tag.name);

W przypadku, gdy wprowadzony jest w systemie, w którym jest dostępny system, można wprowadzić w ten sposób: w systemach, w których jest dostępna widoczna wersja, w której jest dostępne system, w systemów, w jakich jest dostępność.

cd selsup-extension-example
npm test
npm start
# Mock host: http://localhost:4174/
# Panel: http://127.0.0.1:4173/

Content-Security-Policy: default-src 'none'; script-src 'self'; style-src 'self'; connect-src 'none'; form-action 'none'; base-uri 'none'; frame-ancestors https://your-cabinet.example.com
Referrer-Policy: no-referrer
X-Content-Type-Options: nosniff

https://api.selsup.ru/assets/examples/selsup-extension-example.zip

Sandbox blokuje formularze, wyszkiwy, pobierania, najwyższą nawigację i wrażliwe API przeglądarki. Pochodzenie panela jest wyświetlane powyżej iframe. Rozszerzenie nie może żądać hasła SelSup. Strona może nadal zobaczyć adres IP odwiedzającego i zachować lub przekazywać dane udzielone.

SelSup autoryzuje samą połączenia iframe bridge; pliki cookie i żetony nigdy nie dotrą do aplikacji. Twój własny backend nadal potrzebuje własnej uwierzytelniania: kontekst nie udowadnia tożsamości. Trzymaj długotrwałe żetonki SelSup tylko na serwerze.