Ali Cloud SMS Service (SMS)API الوصول إلى البرنامج التعليمي: دعم Vue SpringBoot

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

ينظر العديد من المبتدئين إلى مستندات الرسائل القصيرة الرسمية لـ Ali Yun ، ويسهل عليهم الشعور بالدوار من خلال مجموعة من مفاهيم AccessKey والتوقيعات والقوالب و SDK. بالإضافة إلى ذلك ، غالبًا ما تكون رموز الأمثلة الرسمية منتفخة ، ولا يعرفون كيفية الاندماج مع مشاريعهم الأمامية والخلفية لفترة من الوقت.

لن أضيع الوقت اليوم، سننتقل مباشرة إلى التطبيق العملي. يأخذك إلى "أسلوب الكتابة الحية" الأكثر تبعيًا ،

5 دقائق تشغيل خدمة الرسائل القصيرة Alibaba Cloud (SMS) من تكوين الخلفية إلى الحزمة المنطقية الأساسية لـ Spring Boot الخلفية ، ثم إلى تنفيذ العد التنازلي الكامل لـ Vue الأمامي.

عمليات التفاعل الأساسية

قبل كتابة الرمز ، قم أولاً بملء منطق الحلقة المغلقة للرسائل النصية لرمز التحقق:

نص عادي

[الواجهة الأمامية لـ Vue] ── 1. أدخل رقم هاتفك المحمول ، انقر فوق الإرسال> [الواجهة الخلفية لـ Spring Boot]

▲ │

│ 2. توليد 6 أرقام عشوائية

│ 3. الإيداع في Redis (تعيين 5 دقائق تنتهي)

│ 4. استدعاء واجهة برمجة تطبيقات علي بابا سحابة لإرسال

│ │

│ ▲

【هاتف المستخدم】 <─── 5. استلام رمز التحقق عبر رسالة نصية ───── 【بوابة رسائل SMS التابعة لعلي كلاود】

الخطوة الأولى: فتح Alibaba Cloud Console وتطبيق التأهيل (دقيقتان)

نظرًا لحوكمة مكافحة الاحتيال المحلية الصارمة جدًا ، خدمة الرسائل القصيرة

يجب أولاً تقديم طلب الحصول على المؤهلات وتوقيع الوثائق

، اتصل مباشرة بخطأ أذونات الإبلاغ عن API.

1-فتح الخدمات

سجّل الدخول إلى وحدة تحكم Alibaba Cloud، وابحث

"خدمة الرسائل القصيرة"

، انقر لفتح (فتح مجاني ، إرسال خصم على الخط ، يوصى بشراء حزمة بعشرات الدولارات).

2. طلب توقيع الرسائل القصيرة (من أنت)

أدخل وحدة التحكم في خدمة الرسائل القصيرة ، وانقر على "الرسائل المحلية" $ \ rightarrow $ "إدارة التوقيع" $ \ rightarrow $ "إضافة توقيع" على اليسار.

اسم التوقيع: عادةً ما يكون اسم موقع الويب الخاص بك أو اسم التطبيق أو اختصار الشركة (مثل مدونة المهوس).

مصدر التوقيع: يختار المطورون الفرديون عمومًا "مواقع الويب المسجلة" أو "التطبيقات الحقيقية" ، والتي تحتاج إلى توفيرها

رقم تسجيل ICP الخاص بك أو لقطة شاشة للتطبيق.

3. التقدم بطلب للحصول على قالب الرسائل القصيرة (ما الذي أرسلته)

انتقل إلى “إدارة القوالب” $\rightarrow$ “إضافة قالب”.

نوع القالب: اختر "رمز التحقق".

اسم القالب: مثل رمز التحقق من الدخول.

محتوى القالب: صيغة ثابتة، تُرمز إلى المتغيرات بالصيغة ${code}. على سبيل المثال: أنت بصدد تسجيل الدخول إلى النظام، رمز التحقق هو: ${code}، وساري المفعول لمدة 5 دقائق، يُرجى عدم إفشائه لأي شخص آخر.

إرسال للمراجعة، عادةً 10~ يمكن اجتيازه في 30 دقيقة. تذكر رمز القالب بعد اجتياز المراجعة (مثل SMS_1234567).

الخطوة الثانية: الربط الأساسي مع خادم Spring Boot (3 دقائق)

لا تستخدموا الإصدار القديم من SDK؛ نعتمد مباشرةً أحدث إصدار من Alibaba Cloud.

الإصدار 2.0

SDK جافا للحوسبة السحابية الأصلية، مع كود أكثر إيجازًا.

1. إضافة تبعية Maven

في مشروع Spring Boot الخاص بك

بوم.إكس إم إل

إدخال المكتبة الأساسية لخدمة الرسائل القصيرة من علي بابا سحابة:

إكس إم إل

<اعتماد>

<groupId>com.aliyun</groupId>

<artifactId>dysmsapi20170525</artifactId>

<الإصدار> 3.0.0</الإصدار> </dependency>

2. قم بتكوين المفتاح في ملف application.yml

تذكر مبدأ الحد الأدنى من أذونات ذاكرة الوصول العشوائي الذي تحدث عنه في العدد الأخير ؟ انتقل إلى Alibaba Cloud RAM وحدة التحكم لبناء حساب فرعي ، فقط أعطني

وصول كامل إلى خدمة الرسائل القصيرة من علي بابا سحابة

(إدارة الرسائل القصيرة) الصلاحية، قم بإنشاء مجموعة من مفتاحي AK/SK واملأهما هنا:

يانل

عليين:

Sms:

الوصول-key-id: LTAI5tXXXXXXXXXXXX # الحساب الفرعي AK

الوصول-key-secret: Pn7yXXXXXXXXXXXXXXXXXX # حساب فرعي SK

اسم التوقيع: مدونة المهووسين # التوقيع الذي تمت الموافقة عليه لطلبك

Template-code: SMS_1234567 # التقدم بطلب للحصول على معرف القالب من خلال

3. حزمة أدوات إرسال الرسائل القصيرة

قم بإنشاء خدمة ، قم بنسخ رمز البضائع الجافة النقي الذي قمت بتحسينه لك مباشرة:

جافا

Import com.aliyun.dys

Msapi20170525.Client;

استيراد com.aliyun.dysmsapi20170525.models.SendSmsRequest;

Import com.aliyun.dysmsapi20170525.mo dels.SendSmsResponse;

Import com.aliyun.teaopenapi.mo dels. Config؛

Import org.springframework.beans.factory.annotation.Value ؛

Import org.springframework.stereotype.Service ؛

@ Service

فئة عامة SmsService {

@Value("${aliyun.sms.access-key-id}")

Private String accessKeyId;

@ Value("${aliyun.sms. الوصول-key-secret}")

Private String accessKeySecret;

@Value("${aliyun.sms.sign-name}")

Private String signName;

@Value("${aliyun.sms.template-code}")

Private String templateCode;

/**

* إرسال رمز التحقق SMS

* رقم الهاتف المستهدف @ param phone

* رمز التحقق العشوائي @ param code

*/

public boolean sendVerifyCode(String phone, String code) {

جرّب {

// 1. تهيئة عميل التكوين

Config config = new Config()

. تعيين معرف الوصول (accessKeyId)

. SetAccessKeySecret (accessKeySecret) ؛

// نقطة وصول خدمة الرسائل القصيرة الثابتة

config.endpoint = "dysmsapi.aliyuncs.com";

عميل عميل = جديد عميل(تكوين);

// 2. تجميع معلمات الطلب

طلب إرسال رسالة قصيرة request = جديد طلب إرسال رسالة قصيرة()

. SetPhoneNumbers (phone)

. تعيين اسم التوقيع (signName)

. تعيينرمزالقالب(الرمز_القالبي)

// يجب تحويل المتغير إلى صيغة سلسلة JSON

. setTemplateParam("{\"code\":\"" code "\"}");

// 3. تنفيذ الإرسال

استجابةSendSms = إرسالSMS.عميل.إشعار

// 4. تحديد نتيجة الإرسال

إذا كانت ("OK".equals(response.getBody().getCode())) {

إرجاع صحيح؛

} آخرًا {

System.err.println("فشل إرسال الرسالة النصية، السبب: "+ response.getBody().getMessage());

إرجاع خاطئ؛

}

} Catch (Exception e) {

هـ-printStackTrace() ؛

إرجاع خاطئ؛

}

}

}

4. إنشاء واجهة الأعمال للوحدة المتحكِّمة

في طبقة Controller ، قم بدمج Redis الخاص بك (هنا يتم استخدام الرمز الزائف بدلاً من عرض الحلقة المغلقة المنطقية):

جافا

@ControllerRest

@طلبM

إطلاق طلب (/api/sms)

فئة عامة SmsController {

@إليف

خدمة رسائل قصيرة خاصة smsService;

@إليف

خاص StringRedisTemplate redisTemplate; // إدراج Redis

@PostMapping("/send")

إجابة عامة للكائن ResponseEntity من نوع String تُرسل الرمز بناءً على المعلمة phone المُرسلة عبر الطلب.

// 1. التحقق البسيط من صحة رقم الهاتف المحمول باستخدام التعبيرات النمطية

إذا لم يكن phone.matches("^1[3-9]\\d{9}$")) {

إرجاع ResponseEntity.badRequest().body("تنسيق رقم الهاتف غير صحيح")؛

}

// 2. آلية مكافحة الإرسال المتكرر: التحقق من Redis للتأكد من عدم إرسال مُكرر خلال 60 ثانية

إذا (تساوي القيمة المنطقية true نتيجة لاستدعاء الدالة hasKey في كائن redisTemplate مع المفتاح "SMS_LIMIT:" مضافًا إليه رقم الهاتف) {

إرجاع ResponseEntity بحالة HttpStatus.TOO_MANY_REQUESTS ومحتوى "تم الإرسال بشكل متكرر للغاية، يُرجى المحاولة مرة أخرى لاحقًا".

}

// 3. إنشاء رمز تحقق عشوائي مكوّن من 6 أرقام

رمز سلسلة = سلسلة.valueOf((int)((Math.random() * 9 1) * 100000));

// 4. استدعاء خدمة علي بابا السحابية لإرسال

بووليان نجاح = خدمة_الرسائل_القصيرة.إرسال_رمز_التحقق(رقم_الهاتف، الرمز);

إذا لم يكن نجح) {

إرجاع ResponseEntity بحالة 500 ومحتوى "فشل إرسال الرسالة النصية، يُرجى الاتصال بالمسؤول"

}

// 5. احفظ في Redis، وعيّن صلاحية لمدة 5 دقائق؛ وفي الوقت نفسه عيّن واحدًا

حدّ مكافحة التهكير لمدة 60 ثانية

redisTemplate.opsForValue().set("SMS_CODE:" + phone, code, 5, TimeUnit.MINUTES);

redisTemplate.opsForValue().set("SMS_LIMIT:" + phone, "1", 60, TimeUnit.SECONDS);

إرجاع ResponseEntity بنجاح: "تم إرسال رمز التحقق بنجاح"

}

}

الخطوة الثالثة: برمجة مكوّن العد التنازلي في الواجهة الأمامية باستخدام Vue (1 دقيقة)

تم الانتهاء من النهاية الخلفية ، ويجب أن نمنع المستخدمين من النقر على زر "إرسال" في الواجهة الأمامية ، ونحتاج إلى إجراء العد التنازلي القياسي لمدة 60 ثانية.

هنا

Vue 3 (واجهة برمجة التجميع) Axios

على سبيل المثال ، مباشرة على الكود الأكثر بديهية:

مقتطف التعليمات البرمجية

<قالب>

<div class="sms-box">

<input type="text" v-model="phone" placeholder="يرجى إدخال رقم الهاتف الجوال" />

<button :disabled="isCounting" @click="handleSend">

{{ إذا كان العدّ؟ '${countdown} ثوانٍ ثم إعادة الحصول': 'الحصول على رمز التحقق' }}

</زر)

</div>

</قالب>

<سكريبت إعداد>

Import {ref} من 'vue' ؛

استيراد axios من 'axios';

const phone = ref('');

const العد التنازلي = ref(60);

const هو_العد = ref(false);

Let timer = null ؛

Const handleSend = async () => {

إذا لم يكن /^ 1[3-9]\ d{9}$/.test(phone.value) {

Alert ("الرجاء إدخال رقم الهاتف المحمول الصحيح") ؛

إرجاع؛

}

جرّب {

// استدعاء الواجهة الخلفية

Const res = awa

It axios.post('/api/sms/send ؟ Phone = ${phone.value}') ؛

Alert (res.data) ؛

// تفعيل العد التنازلي

StartCountdown () ؛

} Catch (error) {

Alert (error.response ؟. Data | | "طلب الفشل") ؛

}

} ؛

Const startCountdown = () => {

IsCounting. value = true ؛

Countdown. value = 60 ؛

Timer = setInterval(() => {

Countdown. value-؛

If (countdown.value <= 0) {

ClearInterval (timer) ؛

IsCounting. value = false ؛

}

} ، 1000) ؛

} ؛

</Script>

دليل تجنب الحفر لبيئة الإنتاج (تجربة Yunwei للدم والدموع)

احذر من "قصف الرسائل النصية" من قبل المتسللين! بمجرد اتصال الواجهة بالإنترنت ، سيطلب المتسللون واجهة/api/sms/send بجنون باستخدام البرامج النصية الآلية التي تحمل عشرات الآلاف من أرقام الهواتف المحمولة العشوائية. يمكنك خصم رصيد حساب Alibaba Cloud بالكامل في ليلة واحدة. الدفاع عن القانون الحديدي: بالإضافة إلى العد التنازلي لمدة 60 ثانية في الواجهة الأمامية واستخدام Redis لتقييد تردد رقم الهاتف المحمول الفردي لمدة 60 ثانية في النهاية الخلفية ، يجب إضافة "رمز التحقق الرسومي" أو "التحقق من شريط التمرير البشري" بالقوة إلى واجهة إرسال الرسائل القصيرة. فقط الطلبات القانونية لنجاح اللغز ، الخلفية هي الرسائل النصية.

تسبب "حد التردد" الذي تسبب في الإبلاغ عن أخطاء Alibian Cloud ، وقد جلبت الرسالة النصية الرسمية لـ Alibaba Cloud مجموعة من آليات التحكم في التدفق ومنع الفرشاة (لا يوجد أكثر من رقم هاتف محمول واحد في دقيقة واحدة ، ولا يزيد عن 5 في ساعة واحدة ، ولا يزيد عن 10 في يوم واحد). إذا قمت بإرسال رسالة نصية إلى نفسك بشكل محموم أثناء الاختبار المحلي ، وفجأة أبلغت عن خطأ.

مع هذه المجموعة من الحلقات المغلقة الأمامية والخلفية ، يتمتع تطبيق الخدمة المصغرة رسميًا بقدرات إخطار الرسائل القصيرة المتوافقة والآمنة. اسرع وانشر وجربها!