Jak połączyć Vercel z Shopify Flow

Vercel wysyła webhook w momencie utworzenia wdrożenia, jego pomyślnego zakończenia, niepowodzenia lub zmiany projektu lub domeny. Funkcja Workflow Webhooks przekształca to wywołanie w wyzwalacz Shopify Flow, dzięki czemu Państwa sklep może na nie zareagować: oznaczyć klienta, dodać notatkę do zamówienia, wysłać wewnętrzną wiadomość e-mail, zaktualizować metapole - czyli wykonać dowolną czynność, do której umożliwia Shopify Flow.

Niniejszy przewodnik opisuje cały proces - Vercel wysyła dane, usługa Workflow Webhooks je odbiera i weryfikuje, a Shopify Flow podejmuje odpowiednie działania - przy czym przy każdym żądaniu sprawdzany jest podpis HMAC serwisu Vercel, dzięki czemu wyłącznie Vercel może uruchomić Państwa przepływ pracy.

Co można zbudować

• Proszę wysłać wiadomość e-mail do swojego zespołu w przypadku niepowodzenia wdrożenia interfejsu sklepu typu „headless”.
• Po każdym pomyślnym wdrożeniu proszę zapisać identyfikator wdrożenia produkcyjnego w polu metadanych sklepu.
• Gdy wdrożenie będzie gotowe, proszę uruchomić proces odświeżania pamięci podręcznej lub ponownego indeksowania.

Typowe zdarzenia, które należy przesyłać: deployment.succeeded, deployment.error, project.created.

Zanim zaczną Państwo

• Webhooki Workflow Webhooks zainstalowane w Państwa sklepie Shopify.
• Zainstalowano aplikację Shopify Flow, którą można pobrać bezpłatnie ze sklepu Shopify App Store.
• Konto w serwisie Vercel z uprawnieniami do tworzenia webhooków.

Krok 1 - Utwórz webhook w sekcji Workflow Webhooks

1. Proszę otworzyć sekcję Workflow Webhooks → Webhooks → Utwórz webhook i nadać mu nazwę, którą będą Państwo w stanie rozpoznać w Shopify Flow, na przykład Vercel events.
2. W sekcji Uwierzytelnianie proszę wybrać opcję HMAC.
3. W sekcji Dostawca podpisu proszę wybrać opcję Vercel. Aplikacja automatycznie wypełni pola dotyczące nagłówka, algorytmu, podpisanej treści oraz okna odtworzenia - nie trzeba konfigurować żadnych innych ustawień.
4. Na razie proszę pozostawić pole „secret” puste i kliknąć Zapisz. Proszę skopiować adres URL webhooka wyświetlony na stronie.

Informacje na temat pozostałych trybów uwierzytelniania można znaleźć w sekcji Uwierzytelnianie, a informacje dotyczące wyboru pól, które mają zostać przesłane do Shopify Flow - w sekcji Mapowanie danych użytkowych i zmienne w Shopify Flow.

Krok 2 - Dodanie punktu końcowego w serwisie Vercel

W serwisie Vercel proszę otworzyć sekcję Ustawienia → Webhooki dla zespołu lub projektu, utworzyć webhook przy użyciu skopiowanego adresu URL, a następnie skopiować wyświetlony klucz tajny.

Jak znaleźć swój klucz tajny do podpisywania w Vercel

Sekret webhooka wyświetlony podczas tworzenia webhooka (lub sekret klienta integracji).

W dokumentacji serwisu Vercel dotyczącej podpisów webhooków znajdą Państwo dokładne sformułowania oraz zrzuty ekranu dotyczące Państwa konta.

Wklej ten klucz tajny w polu Secret (Klucz tajny) webhooka w sekcji Workflow Webhooks i zapisz zmiany. Od tego momentu każda dostawa z serwisu Vercel będzie weryfikowana przed dotarciem do Shopify Flow.

Co to sprawdza

Co	Wartość
Nagłówek podpisu	x-vercel-signature
Miejsce umieszczenia podpisu	Cała wartość nagłówka
Co zostało podpisane	{body}
Podpis	HMAC-SHA1, zakodowany w systemie szesnastkowym
Sygnatura czasowa	Nie jest używane przez tego nadawcę
Ochrona przed ponownym odtworzeniem	Brak - ten nadawca nie podpisuje znacznika czasu, więc każdy ważny podpis zachowuje swoją ważność
Sekret	Należy użyć jako zwykły tekst. Proszę wkleić go dokładnie tak, jak przedstawił go nadawca

W podpisanej treści żądania {body} stanowi surową treść żądania, bajt po bajcie.

Żądanie, które nie spełnia któregokolwiek z tych warunków, jest odrzucane z kodem błędu 401, rejestrowane w sekcji Historia i rozwiązywanie problemów i nigdy nie uruchamia przepływu pracy.

Krok 3 - Utwórz proces w Shopify Flow

1. W Shopify Flow proszę utworzyć przepływ pracy i wybrać wyzwalacz Workflow Webhooks.
2. Proszę kliknąć opcję Rejestruj zdarzenia, a następnie wysłać zdarzenie testowe z serwisu Vercel (lub skorzystać z opcji Wyślij zdarzenie testowe w sekcji Workflow Webhooks), aby usługa Shopify Flow mogła rozpoznać strukturę Państwa danych.
3. Każdy posiadany przez Państwa webhook uruchamia ten sam wyzwalacz w Shopify Flow, dlatego proszę dodać pierwszy warunek oparty na identyfikatorze webhooka, aby ograniczyć ten przepływ pracy wyłącznie do serwisu Vercel. Identyfikator ten jest widoczny na stronie webhooka.
4. Proszę dodać swoje działania - oznaczyć klienta, dodać notatkę, wysłać wewnętrzną wiadomość e-mail, zaktualizować metapole.

Krok 4 - Przeprowadź test od początku do końca

Wywołaj rzeczywiste zdarzenie w Vercel. W sekcji Workflow Webhooks → History powinno pojawić się wywołanie o statusie Success. Jeśli podpis był nieprawidłowy, pojawi się zamiast tego wpis o niepowodzeniu wraz z przyczyną, a Weryfikacja podpisanych webhooków zawiera opis narzędzia do weryfikacji podpisu, które wskazuje dokładnie, który etap zakończył się niepowodzeniem.

Powiązane

• Weryfikacja podpisanych webhooków - każdy dostawca, którego weryfikujemy, oraz sposób opisania dostawcy, którego nie weryfikujemy.
• Mapowanie danych użytkowych i zmienne w Shopify Flow - pobieranie odpowiednich pól z danych przesyłanych i wprowadzanie ich do Shopify Flow.
• Ochrona przed podwójną dostawą - co się dzieje, gdy Vercel ponawia próbę dostarczenia.
• Historia i rozwiązywanie problemów - dziennik wszystkich żądań wraz z możliwością odtworzenia.