Testreszabott üzenetek küldése a kérelem ellazításához

A Slack egy népszerű üzenetkezelő alkalmazás, amelyet sok csapat használ. Sok szolgáltatással és API-val érkezik a fejlesztők számára, hogy integrálják az alkalmazásukkal. A mai bejegyzésben látni fogjuk, hogyan használhatjuk az egyik Bejövő Webhooks szolgáltatását, hogy külsõ alkalmazásból adatot küldjön.

Így tudjuk egyszerűen küldjön üzeneteket a Slack-nek a már meglévő alkalmazásokból; jelentéseket, frissítéseket, híreket, értesítéseket és többet küldhetünk. Ehhez a hozzászóláshoz JavaScript-t használtam a példában. Először jelentkezzen be a csapat Slack-fiókjába.

1. Állítsa be az integrációt

Először be kell állítania egy bejövő webhook integrációt. Menj yourteam.slack.com/apps/build/custom-integration és kattintson a gombra Bejövő webhookok, majd válasszon ki egy csatornát vagy felhasználót, akit üzeneteit közzétesz (a választás később felülbírálható).

Ha elkészült, megjelenik a bejövő webhook-integráció konfigurációs oldala.

Görgessen lefelé, és a formátumban lesz egy Webhook URL https://hooks.slack.com/services/TXXXXXXXX/BXXXXXXXX/token. Ha ezt az URL-t valahol elmenti, később szükségünk lesz rá. Ezen az oldalon is megváltoztathatja az integráció ikonját és nevét, de ezt kódként fogjuk megtenni.

2. Hozza létre az üzenetet

Képzeljük el, hogy már létrehoztál egy olyan webalkalmazást, amely a Valentin-nap értékesítését kéri a népszerű webhelyeken, valamint az értékesítés során használt ajánlati kódokat, és valamilyen oknál fogva meg szeretné osztani ezt az eredményt a Slack csapat tagjaival.

Most mindössze annyit kell tennünk, hogy az előző lépésben létrehozott webhook URL-t használjuk, és kérelmet küldünk az alkalmazásból a JSON adatokkal, amelyek az értékesítési ajánlat üzenetét megfogják.

Először össze kell állítanunk a JSON karakterláncot, amelyet a Slack üzenetnek kell fordítania. A JSON adatot hordozó paramétert hasznos terhelésnek nevezik, így a JSON karakterláncnak így kell lennie:

var myJSONStr = 'payload = "felhasználónév": "SALE BOT", "icon_url": "example.com/img/icon.jpg", "csatorna": "#general"' 

icon_url az a kép URL-je, amely a profilképként jelenik meg, azt is használhatja icon_emoji például egy profi képként emoji-t jelenít meg "icon_emoji": ": ajándék:". "csatorna" meghatározza az üzenetet megjelenítő csatornát vagy felhasználónévet. Felhasználónév használatához használja a szintaxist "@felhasználónév", csatornára "#Channelname".

Most az aktuális üzenetre; hozzáadhatja a "szöveg" tulajdonságot, és írja meg az üzenetét értékként, és végezze el vele, vagy használja a hívott tulajdonságot "Attachment" gazdagon formázott szöveg hozzáadása, amit most fogunk csinálni.

A "Attachment" tulajdona hasznos teher így megy:

"mellékletek": ["visszaesés": "A melléklet nem támogatott.", "cím": "VALENTINE DAY OFFER", "color": "# 9C1A22", "ürügy": "A mai felsorolt ​​fantasztikus ajánlatok listája Önnek "," szerző_neve ":" Preethi "," author_link ":" https://www.hongkiat.com/blog/author/preethi/ "," author_icon ":" https://assets.hongkiat.com/ uploads / author / preethi.jpg "," mrkdwn_in ": [" szöveg "," mezők "]," szöveg ":" Csak kattintson a webhelynevekre, és kezdje meg a vásárlást. "," thumb_url ":" http://example.com/thumbnail.jpg "]

„Tartalék” az alternatív szöveg, amely akkor jelenik meg, amikor a Slack üzenetet olyan alkalmazásban tekintik meg, amely nem támogatja az üzenet mellékletét (például a mobil értesítésekben).

"szín" az üzenet bal oldali szegélye.

„Ürügy” a fő tartalom előtt megjelenő szöveg.

"Author_link" az a URL, amelyre a szerző neve hivatkozik (ha van ilyen).

"Mrkdwn_in" olyan tulajdonságnevek tömbje, amelyek értékei az üzenetben formázva vannak - a (*) jelölés szintaxis alapján félkövér és (_) a dőlt. A három lehetséges érték "Mrkdwn_in" "szöveg", "ürügy" és "mezők"

"Thumb_url" a miniatűr kép URL-je.

Az üzenet így néz ki.

Most adjuk hozzá a mezőket a csatolt tömbhöz, amely két oszlopban jeleníti meg a webhelyeket és az ajánlatkódokat.

"mezők": ["cím": "webhelyek", "érték": "__ \ N__ "," rövid ": true, " title ":" Ajánlatkód "," érték ":" UI90O22 "-" rövid ": igaz], 

Használat \ n vonaltörés és a szintaxis hozzáadásához hiperhivatkozások hozzáadásához.

Az aláhúzás a szöveg dőlt betűvel való formázására szolgál.

rövid beállítása igaz ha az értékeket egymás mellett kell megjeleníteni (mintha rövid lenne). Összefoglalva, a JSONString így néz ki (tartsa a karakterláncot egy sorban a tényleges munkakódban)

var myJSONStr = 'payload = "felhasználónév": "SALE BOT", "icon_url": "example.com/img/icon.jpg", "mellékletek": ["visszaesés": Ez a melléklet nem támogatott. "," cím: "VALENTINE DAY OFFER", "color": "# 9C1A22", "ürügy": "Önnek választott félelmetes ajánlatok listája", "szerző_neve": "Preethi", "author_link": "https : //www.hongkiat.com/blog/author/preethi/ "," author_icon ":" https://assets.hongkiat.com/uploads/author/preethi.jpg "," mezők ": [" cím " : "Webhelyek", "érték": "__ \ N__ "," rövid ": true, " title ":" Ajánlatkód "," érték ":" UI90O22 n- "," rövid ": igaz]," mrkdwn_in ": [" szöveg "," mezők " "]," szöveg ":" Csak kattintson a webhelynevekre és kezdje meg a vásárlást. * Extra kedvezményt kaphat az * * ajánlat kóddal, ha van ilyen. "," Thumb_url ":" http://example.com/thumbnail.jpg "] '; 

3. Tegye közzé a kérést

Most, hogy a postai kérést a JavaScript-ben végezze, használja az alábbi funkciót:

funkció postMessageToSlack () var xmlhttp = új XMLHttpRequest (), webhook_url = url-you-saved-from-before, myJSONStr = json-string-from-above; xmlhttp.open ('POST', webhook_url, false); xmlhttp.setRequestHeader ('Tartalom-típus', 'alkalmazás / x-www-form-urlencoded'); xmlhttp.send (myJSONStr);  

Adja hozzá ezt a funkciót egy gombnyomásra vagy az oldal betöltésére látni, hogy működik.

A végső kimenet így néz ki: