כיצד לשלוח הודעות מותאמות אישית כדי לרפות מן היישום שלך

המרווח הוא יישום הודעות פופולרי בשימוש על ידי צוותים רבים. זה מגיע עם הרבה שירותים API עבור מפתחים לשלב אותו עם היישומים שלהם. בהודעה של היום נראה כיצד להשתמש באחד השירותים שלה שנקרא Incoming Webhooks, כדי לשלוח נתונים לרפות מיישום חיצוני.

כך נוכל בקלות לשלוח הודעות לרפות מכל יישום שכבר יש לנו; אנו יכולים לשלוח דוחות, עדכונים, חדשות, הודעות ועוד. עבור פוסט זה, השתמשתי ב- JavaScript בדוגמה. כדי להתחיל, היכנס לחשבון ה- Slack של הצוות שלך.

1. הגדר את האינטגרציה

תחילה עליך להגדיר שילוב משולב של webhook. לך ל yourteam.slack.com/apps/build/custom-integration ולחץ על נכנסות Webhooks, ולאחר מכן בחר ערוץ או משתמש שאליו ברצונך לפרסם את ההודעות שלך (ניתן לבחור את הבחירה הזו מאוחר יותר בקוד).

לאחר שתסיים, תראה את דף התצורה של האינטגרציה הנכנסת של Webhook.

גלול למטה ותופיע כתובת אתר Webhook בפורמט https://hooks.slack.com/services/TXXXXXXXX/BXXXXXXXX/token. שמור את כתובת האתר במקום כלשהו, ​​נצטרך אותה מאוחר יותר. תוכל גם לשנות את הסמל ואת שם השילוב בדף זה עצמו, אך נעשה זאת בקוד.

2. צור את ההודעה

נניח שכבר יצרת אפליקציית אינטרנט שמחפשת מכירות של חג האהבה באתרים פופולריים, כמו גם את קודי המבצע לשימוש במהלך המכירה, ומסיבה כלשהי אתה רוצה לשתף את התוצאה הזו עם חברי הצוות הרפואי שלך.

כל מה שאנחנו צריכים לעשות עכשיו הוא להשתמש בכתובת האינטרנט webhook שנוצר בשלב הקודם ולפרסם בקשה אליו מהיישום שלך עם נתונים JSON, אשר concoct את ההצעה להציע הודעה.

בואו הראשון להרכיב את מחרוזת JSON כי יהיה להפוך את ההודעה רפה. הפרמטר הנושא את נתוני JSON נקרא מטען, ולכן מחרוזת JSON אמורה להיראות כך:

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

icon_url היא כתובת האתר לתמונה שתופיע כתמונת הפרופיל, תוכל גם להשתמש בה icon_emoji כדי להציג אמוג'י כתמונת הפרופיל במקום, לדוגמה "icon_emoji": ": מתנה:". "ערוץ" מציין את הערוץ או את שם המשתמש שיציג את ההודעה שלך. עבור שם משתמש, השתמש בתחביר "@שם משתמש", עבור ערוץ "#שם הערוץ".

עכשיו עבור ההודעה בפועל; אתה יכול להוסיף את "טקסט" רכוש ולכתוב את ההודעה כערך שלה לעשות עם זה, או להשתמש בנכס שנקרא "מצורף" כדי להוסיף טקסט מעוצב עשיר, וזה מה שאנחנו נעשה עכשיו.

ה "מצורף" רכוש של מטען הולך ככה:

"Attainment": ["" "fallback": "הנמען אינו נתמך", "title": "הצעת יום של Valentine", "color": "# 9C1A22", "תירוץ": "רשימת ההצעות המדהימים של היום עבור "," author_name ":" Preethi "," author_link ":" https://www.hongkiat.com/blog/author/preethi/ "," author_icon ":" https://assets.hongkiat.com/ , "text", "mrkdwn_in": "text", "text", "text": "פשוט לחץ על שמות האתר והתחל לקנות, קבל * הפחתה נוספת עם קוד המבצע *, אם הוא מסופק. "," thumb_url ":" http://example.com/thumbnail.jpg "]

"נסיגה" הוא הטקסט החלופי שיוצג כאשר ההודעה Slack מוצגת ביישום שאינו תומך בהודעה המצורפת (כמו בהודעות לנייד).

"צבע" הוא צבע הגבול השמאלי של ההודעה.

"תירוץ" הוא הטקסט שמוצג לפני התוכן הראשי.

"author_link" היא כתובת האתר מקושרת שם המחבר (אם הוא סיפק).

"mrkdwn_in" הוא מערך של שמות מאפיינים שערכיהם מוצגים בפורמט - מבוסס על תחביר סימון כגון (*) עבור מודגש (_) עבור נטוי. שלושת הערכים האפשריים עבור "mrkdwn_in" הם "טקסט", "תירוץ" ו"שדות "

"thumb_url" היא כתובת האתר של התמונה הממוזערת.

כך ייראה המסר עד כה.

עכשיו בואו נוסיף את השדות למערך הקבצים המצורפים, אשר יציג את האתרים ומציע קודים בשתי עמודות.

"שדות": ["title": "Sites", "value": "__ \ n__ "," short ": true, " title ":" Offer Code "," value ":" UI90O22 \ n- "," short ": true], 

להשתמש \ n כדי להוסיף מעבר שורה ותחביר כדי להוסיף היפר.

קו תחתון משמש לעיצוב טקסט באותיות נטיות.

קצר נקבע ל נכון אם הערכים יוצגו זה לצד זה (כמו אם הוא קצר). להרכיב, JSONString יראה ככה (לשמור את המחרוזת בשורה אחת בקוד עובד בפועל)

var myJSONStr = 'payload = "username": "SOT BOT", "icon_url": "example.com/img/icon.jpg", "קבצים מצורפים": ["fallback": "הנספח הזה אינו נתמך. "" כותרת ":" כותרת ":" "" יום הולדת ":" כותרת ":" כותרת "," צבע ":" # 9C1A22 "," תירוץ ":" רשימה של הצעות מדהימות שנבחרו עבורך "," author_name ":" Preethi "," author_link ":" https : //www.hongkiat.com/blog/author/preethi/ ", author_icon": "https://assets.hongkiat.com/uploads/author/preethi.jpg", "field": ["title" : "Sites", "value": "__ \ n__ "," short ":" true "," "title": "קוד הצעה", "value": "UI90O22 \ n-", "short": true], "mrkdwn_in": ["text", שדות "]," text ":" פשוט לחץ על שמות האתר והתחל לקנות. קבל הפחתה נוספת עם קוד ההצעה *, אם הוא מסופק. "," Thumb_url ":" http://example.com/thumbnail.jpg "]; '; 

3. פרסם את הבקשה

עכשיו כדי להפוך את הבקשה לכתוב ב- JavaScript, להשתמש בפונקציה להלן:

הפונקציה postMessageToSlack () var xmlhttp = XMLHttpRequest חדש (), webhook_url = url-you-save-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);  

הוסף פונקציה זו ללחיצה על לחצן או לטעינת דפים לראות את זה עובד.

הפלט הסופי ייראה בערך כך: