Przejdź do głównej treści

Instalacja

Dołącz bibliotekę klienta Komerza przez CDN. Dodaj ten tag skryptu do swojego HTML:
<script src="https://cdn.komerza.com/komerza.min.js"></script>
Biblioteka jest dostępna globalnie jako globalThis.komerza po załadowaniu skryptu.

Korzyści CDN

  • Nie wymaga kroku budowania - Działa z czystym HTML/CSS/JS
  • Zawsze aktualne - Najnowsza wersja dostarczana automatycznie
  • Szybkie ładowanie - Buforowane globalnie przez CDN
  • Lekkie - Minimalny wpływ na czas ładowania strony

Inicjalizacja

Zainicjalizuj bibliotekę swoim ID sklepu przed użyciem jakichkolwiek innych funkcji:
komerza.init("twoje-id-sklepu");
Musisz wywołać init() przed użyciem jakiejkolwiek innej funkcji komerza. Wszystkie inne funkcje zakończą się niepowodzeniem, jeśli biblioteka nie została zainicjalizowana.

Znajdowanie ID swojego sklepu

ID Twojego sklepu jest dostępne w panelu Komerza. Jest to unikalny identyfikator Twojego sklepu, zazwyczaj w formacie UUID.

Przykład

<!DOCTYPE html>
<html>
  <head>
    <title>Mój Sklep</title>
    <script src="https://cdn.komerza.com/komerza.min.js"></script>
  </head>
  <body>
    <div id="store-name"></div>

    <script>
      // Zainicjalizuj z ID swojego sklepu
      komerza.init("550e8400-e29b-41d4-a716-446655440000");

      // Teraz możesz używać innych funkcji komerza
      komerza.getStore().then((response) => {
        if (response.success) {
          document.getElementById("store-name").textContent =
            response.data.name;
        }
      });
    </script>
  </body>
</html>

Kiedy inicjalizować

Wywołaj init() raz przy ładowaniu strony, przed użyciem jakichkolwiek innych metod komerza: ✅ Dobrze - Inicjalizuj przy ładowaniu strony:
<script>
  // Inicjalizuj natychmiastowo komerza.init('twoje-id-sklepu'); // Następnie
  używaj innych funkcji wyswietlProdukty();
</script>
❌ Źle - Używaj metod przed init:
<script>
  // To się nie powiedzie - init nie został wywołany komerza.getStore(); //
  Błąd! komerza.init('twoje-id-sklepu');
</script>

Integracja z frameworkami

Vanilla JavaScript

<!DOCTYPE html>
<html>
  <head>
    <script src="https://cdn.komerza.com/komerza.min.js"></script>
  </head>
  <body>
    <script>
      komerza.init("twoje-id-sklepu");
    </script>
  </body>
</html>

React

import { useEffect } from "react";

function App() {
  useEffect(() => {
    // Inicjalizuj przy montowaniu komponentu
    if (globalThis.komerza) {
      globalThis.komerza.init("twoje-id-sklepu");
    }
  }, []);

  return <div>Mój Sklep</div>;
}

Vue

<script>
export default {
  mounted() {
    // Inicjalizuj przy montowaniu komponentu
    if (globalThis.komerza) {
      globalThis.komerza.init("twoje-id-sklepu");
    }
  },
};
</script>

Svelte

<script>
  import { onMount } from 'svelte';

  onMount(() => {
    // Inicjalizuj przy montowaniu komponentu
    if (globalThis.komerza) {
      globalThis.komerza.init('twoje-id-sklepu');
    }
  });
</script>