Jak odesílat přizpůsobené zprávy do Slack z vaší aplikace

Slack je populární aplikace pro zasílání zpráv používaná mnoha týmy. Dodává se s mnoha službami a API pro vývojáře, aby je mohli integrovat s jejich aplikacemi. V dnešním příspěvku uvidíme, jak používat jednu z jeho služeb s názvem Incoming Webhooks, abychom mohli odesílat data do externích aplikací..

Tímto způsobem můžeme snadno posílat zprávy do Slacku z jakékoli aplikace, kterou již máme; můžeme posílat zprávy, aktualizace, novinky, oznámení a další. Pro tento příspěvek jsem v příkladu použil JavaScript. Chcete-li začít, přihlaste se do účtu Slack svého týmu.

1. Nastavte integraci

Nejprve budete muset nastavit příchozí integraci webhook. Jít do yourteam.slack.com/apps/build/custom-integration a klikněte na Příchozí Webhookové, poté vyberte kanál nebo uživatele, kterému chcete posílat zprávy (tento výběr může být později přepsán v kódu).

Jakmile budete hotovi, uvidíte konfigurační stránku příchozí integrace webhooku.

Přejděte dolů a ve formátu bude uvedena adresa URL Webhook https://hooks.slack.com/services/TXXXXXXXX/BXXXXXXXX/token. Někdy tuto adresu URL uložíme, budeme ji potřebovat později. Ikonu a název integrace můžete dále změnit na této stránce, ale uděláme to v kódu.

2. Vytvořte zprávu

Představme si, že jste již vytvořili webovou aplikaci, která vyhledává prodeje na Valentýna v oblíbených lokalitách, stejně jako kódy nabídek pro použití během prodeje, a z nějakého důvodu chcete tento výsledek sdílet se svými členy týmu Slack.

Jediné, co nyní musíme udělat, je použít URL webhook vytvořené v předchozím kroku a poslat na něj požadavek z vaší aplikace s daty JSON, které budou odkazovat na zprávu prodejní nabídky.

Nejdříve dáme dohromady JSON řetězec, který se změní na Slackovu zprávu. Parametr nesoucí data JSON se nazývá užitečné zatížení, proto by řetězec JSON měl vypadat takto:

var myJSONStr = 'payload = "username": "PRODEJ BOT", "icon_url": "example.com/img/icon.jpg", "channel": "#general"' 

icon_url je adresa URL obrázku, který se zobrazí jako obrázek profilu, můžete také použít icon_emoji namísto toho například zobrazit emoji jako obrázek profilu "icon_emoji": ": gift:". "kanál" určuje kanál nebo uživatelské jméno, které zobrazí vaši zprávu. Pro uživatelské jméno použijte syntaxi „@uživatelské jméno“, pro kanál "#channelname".

Nyní pro aktuální zprávu; můžete buď přidat "text" a napište svou zprávu jako svou hodnotu a proveďte s ní, nebo použijte vlastnost zvanou "příloha" přidat bohatě formátovaný text, což je to, co budeme dělat teď.

"příloha" majetek užitečné zatížení jde takto:

"Přílohy": ["nouzové": "Příloha není podporována.", "název": "NABÍDKA VALENTINE'S DEN", ​​"barva": "# 9C1A22", "pretext": "Vybral se dnešní seznam úžasných nabídek pro vás "," jméno_uzivatele ":" Preethi "," author_link ":" https://www.hongkiat.com/blog/author/preethi/ "," author_icon ":" https://assets.hongkiat.com/ uploads / author / preethi.jpg "," mrkdwn_in ": [" text "," pole "]," text ":" Stačí kliknout na názvy stránek a začít kupovat. Získejte * extra redukci s kódem nabídky *, pokud je k dispozici. "," thumb_url ":" http://example.com/thumbnail.jpg "]

"ustoupit" je alternativní text, který se zobrazí při zobrazení zprávy Slack v aplikaci, která nepodporuje přílohu zprávy (například v mobilních oznámeních).

"barva" je barva levého okraje zprávy.

"záminka" je text zobrazený před hlavním obsahem.

"author_link" je adresa URL odkazovaná na jméno autora (je-li k dispozici).

"mrkdwn_in" je pole názvů vlastností, jejichž hodnoty jsou zobrazeny ve formátu zprávy - na základě syntaxe markdown jako (*) pro tučné písmo a (_) pro kurzívu. Tři možné hodnoty pro "mrkdwn_in" jsou "text", "pretext" a "pole"

"thumb_url" je adresa URL miniatury.

Takto bude zpráva vypadat tak daleko.

Nyní přidáme pole do pole příloh, které zobrazí weby a nabídne kódy ve dvou sloupcích.

"pole": ["title": "Stránky", "hodnota": "___ "," krátký ": true, " title ":" Kód nabídky "," hodnota ":" UI90O22 n- "," short ": true], 

Použití n přidat konec řádku a syntaxi přidat hypertextové odkazy.

Podtržítko se používá k formátování textu kurzívou.

krátký je nastavena na skutečný pokud mají být hodnoty zobrazeny vedle sebe (jako kdyby byly krátké). JSONString bude vypadat takto (ponechte řetězec v jediném řádku v aktuálním pracovním kódu)

var myJSONStr = 'payload = "username": "PRODEJ BOT", "icon_url": "example.com/img/icon.jpg", "přílohy": ["nouzové": "Tato příloha není podporována. "," title ":" NABÍDKA VALENTINE'S DAY "," color ":" # 9C1A22 "," pretext ":" dnešní seznam úžasných nabídek, které pro vás byly vybrány "," jméno_programu ":" Preethi "," author_link ":" https : //www.hongkiat.com/blog/author/preethi/ "," author_icon ":" https://assets.hongkiat.com/uploads/author/preethi.jpg "," fields ": [" title " : "Stránky", "hodnota": "___ "," krátký ": true, " title ":" Kód nabídky "," hodnota ":" UI90O22 n- "," krátký ": true]," mrkdwn_in ": [" text "," pole "," "]," text ":" Stačí kliknout na názvy stránek a začít nakupovat. " Získejte extra slevu s kódem nabídky *, pokud je k dispozici. "," Thumb_url ":" http://example.com/thumbnail.jpg "] '; 

3. Zadejte požadavek

Chcete-li požádat o příspěvek v jazyce JavaScript, použijte níže uvedenou funkci:

funkce postMessageToSlack () var xmlhttp = nová XMLHttpRequest (), webhook_url = url-you-saved-from-before, myJSONStr = json-string-from-above; xmlhttp.open ('POST', webhook_url, false); xmlhttp.setRequestHeader ('Content-Type', 'application / x-www-form-urlencoded'); xmlhttp.send (myJSONStr);  

Tuto funkci přidejte k kliknutí nebo načtení stránky vidět, jak funguje.

Konečný výstup bude vypadat takto: