كيفية إرسال رسائل مخصصة إلى سلاك من التطبيق الخاص بك

سلاك هو تطبيق مراسلة شائع يستخدمه العديد من الفرق. يأتي مع الكثير من الخدمات وواجهة برمجة التطبيقات للمطورين لدمجها مع تطبيقاتهم. في منشور اليوم ، سنرى كيف نستخدم إحدى خدماتها المسماة Webhooks الواردة ، لإرسال البيانات للتخلص من تطبيق خارجي.

بهذه الطريقة نستطيع بسهولة إرسال رسائل إلى سلاك من أي تطبيق لدينا بالفعل. يمكننا إرسال التقارير والتحديثات والأخبار والإشعارات والمزيد. بالنسبة لهذا المنشور ، فقد استخدمت JavaScript في المثال. للبدء ، سجّل الدخول إلى حساب Slack الخاص بفريقك.

1. قم بإعداد التكامل

يجب عليك أولاً إعداد تكامل webhook وارد. اذهب إلى yourteam.slack.com/apps/build/custom-integration وانقر على Webhooks الواردة, ثم حدد قناة أو مستخدمًا تريد نشر رسائلك إليه (يمكن إلغاء هذا التحديد لاحقًا في الرمز).

بمجرد الانتهاء من ذلك ، سترى صفحة تكوين تكامل Webhook الواردة.

قم بالتمرير لأسفل وسيكون هناك عنوان URL لـ Webhook بالتنسيق https://hooks.slack.com/services/TXXXXXXXX/BXXXXXXXX/token. احفظ عنوان URL هذا في مكان ما ، سنحتاج إليه لاحقًا. يمكنك أيضًا تغيير رمز واسم التكامل في هذه الصفحة نفسها ، لكننا سنفعل ذلك في الكود.

2. إنشاء الرسالة

دعنا نتخيل أنك قمت بالفعل بإنشاء تطبيق ويب يبحث عن مبيعات عيد الحب في المواقع الشهيرة وكذلك رموز العرض للاستخدام أثناء البيع ، ولسبب ما ، تريد مشاركة هذه النتيجة مع أعضاء فريق Slack الخاص بك.

كل ما يتعين علينا القيام به الآن هو استخدام عنوان URL الخاص بـ webhook الذي تم إنشاؤه في الخطوة السابقة ونشر طلب عليه من تطبيقك باستخدام بيانات JSON ، والذي سيؤدي إلى تلفيق رسالة عرض البيع.

لنقم أولاً بتجميع سلسلة JSON التي سيتم تحويلها إلى رسالة Slack. تسمى المعلمة التي تحمل بيانات JSON الحمولة ، وبالتالي يجب أن تبدو سلسلة JSON كما يلي:

var myJSONStr = 'payload = "اسم المستخدم": "SALE BOT"، "icon_url": "example.com/img/icon.jpg"، "channel": "#general"' 

icon_url هو عنوان URL للصورة التي ستظهر كصورة للملف الشخصي ، ويمكنك أيضًا استخدامها icon_emoji لعرض رمز تعبيري كصورة الملف الشخصي بدلاً من ذلك ، على سبيل المثال "icon_emoji": ": gift:". "قناة" يحدد القناة أو اسم المستخدم الذي سيرى رسالتك. لاسم المستخدم ، استخدم بناء الجملة "@اسم المستخدم", للقناة "#اسم القناة".

الآن للرسالة الفعلية ؛ يمكنك إما إضافة "نص" خاصية وكتابة رسالتك كقيمة لها ويتم ذلك ، أو استخدام الخاصية يسمى "المرفق" لإضافة نص منسق بشكل غني ، وهو ما سنفعله الآن.

ال "المرفق" ممتلكات الحمولة غني عن مثل هذا:

"المرفقات": ["fallback": "المرفق غير مدعوم." ، "title": "VALENTINE'S DAY OFFER" ، "color": "# 9C1A22" ، "ذريعة": "قائمة اليوم من العروض الرائعة المنتقاة من أجلك "،" author_name ":" Preethi "،" author_link ":" https://www.hongkiat.com/blog/author/preethi/ "،" author_icon ":" https://assets.hongkiat.com/ uploads / author / preethi.jpg "،" mrkdwn_in ": [" text "،" الحقول "]،" text ":" فقط انقر فوق أسماء المواقع وابدأ الشراء. احصل على * تخفيض إضافي مع رمز العرض *، إذا تم توفيره. "،" thumb_url ":" http://example.com/thumbnail.jpg "]

"تراجع" هو النص البديل الذي يتم عرضه عند عرض رسالة Slack في تطبيق لا يدعم مرفقات الرسائل (كما هو الحال في إشعارات الجوال).

"اللون" هو لون الحدود الأيسر للرسالة.

"ذريعة" هو النص الذي يظهر قبل المحتوى الرئيسي.

"author_link" هو عنوان URL الارتباط التشعبي في اسم المؤلف (إذا تم توفيره).

"mrkdwn_in" عبارة عن صفيف من أسماء الخصائص التي يتم إظهار قيمها منسقة في الرسالة - بناءً على بناء جملة تخفيض السعر مثل (*) لخط عريض و (_) لخط مائل. القيم الثلاث الممكنة ل "mrkdwn_in" هي "النص" ، "الذريعة" و "الحقول"

"thumb_url" هو عنوان URL للصورة المصغرة.

إليك كيف ستبدو الرسالة حتى الآن.

الآن دعونا نضيف الحقول إلى صفيف المرفقات ، والتي ستعرض المواقع وتقدم أكواد في عمودين.

"الحقول": ["title": "Sites" ، "value": "__ \ N__ "،" short ": true، " title ":" Code Offer "،" value ":" UI90O22 \ n- "،" short ": true], 

استعمال \ ن لإضافة فاصل الأسطر وبناء الجملة لإضافة الارتباطات التشعبية.

يتم استخدام الشرطة السفلية لتنسيق النص بخط مائل.

قصيرة تم تعيين ل صحيح إذا كانت القيم سيتم عرضها جنبًا إلى جنب (مثل إذا كانت قصيرة). معًا ، ستبدو JSONString هكذا (احتفظ بالسلسلة في سطر واحد في كود العمل الفعلي)

var myJSONStr = 'payload = "اسم المستخدم": "SALE BOT"، "icon_url": "example.com/img/icon.jpg"، "attachments": ["fallback": "هذا المرفق غير مدعوم. "،" title ":" VALENTINE'S DAY OFFER "،" colour ":" # 9C1A22 "،" ذريعة ":" قائمة اليوم بالعروض الرائعة التي التقطتها لك "،" author_name ":" Preethi "،" author_link ":" https : //www.hongkiat.com/blog/author/preethi/ "،" author_icon ":" https://assets.hongkiat.com/uploads/author/preethi.jpg "،" الحقول ": [" title " : "المواقع" ، "القيمة": "__ \ N__ "،" short ": true، " title ":" Code Offer "،" value ":" UI90O22 \ n- "،" short ": true]،" mrkdwn_in ": [" 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)؛  

أضف هذه الوظيفة إلى نقرة زر أو تحميل الصفحة لرؤيتها تعمل.

سيظهر الناتج النهائي كالتالي: