Tutorial penggunaan API Perkhidmatan SMS Alibaba Cloud (SMS): Menyokong Vue dan SpringBoot

awan 2026-05-28 阅读 11

Sama ada untuk pendaftaran pengguna, pengesahan log masuk mahupun pemberitahuan status pesanan, perkhidmatan SMS merupakan keperluan asas.

Ramai pengguna baharu yang membaca dokumen rasmi mengenai perkhidmatan SMS Alibaba Cloud mudah keliru dengan pelbagai konsep seperti AccessKey, tandatangan, templat dan SDK. Tambahan pula, kod contoh rasmi sering kali ditulis secara berbelit-belit, menyebabkan mereka sukar mengetahui cara mengintegrasikannya dengan projek front-end dan back-end masing-masing.

Hari ini tidak mahu berbasa-basi, terus ke latihan sebenar. Membawa anda menggunakan “gaya penulisan sebenar” yang paling dekat dengan kehidupan seharian,

5 minit untuk melaksanakan perkhidmatan SMS Alibaba Cloud, daripada konfigurasi belakang tabir, pengepungan logik utama Spring Boot di pelayan, hinggalah kepada pelaksanaan lengkap fungsi kiraan detik di bahagian hadapan menggunakan Vue.

Proses interaksi teras

Sebelum menulis kod, bayangkan terlebih dahulu logik aliran lengkap bagi pengesahan melalui SMS:

Teks biasa

【Frontend Vue】 ── 1. Masukkan nombor telefon bimbit, klik hantar ──> 【Backend Spring Boot】

▲ │

│ 2. Menjana nombor rawak 6 digit

│ 3. Masukkan ke dalam Redis (tetapkan tempoh tamat selama 5 minit)

│ 4. Memanggil API Alibaba Cloud untuk menghantar

│ │

│ ▼

【Telefon pengguna】 <─── 5. Menerima kod pengesahan melalui SMS ───── 【Gerbang SMS Alibaba Cloud】

Langkah pertama: Aktifkan dan mohon kelayakan di Konsol Alibaba Cloud (2 minit)

Disebabkan tadbir urus pencegahan penipuan di dalam negara amat ketat, perkhidmatan SMS

Pertama sekali, anda mesti memohon kelayakan dan tandatangan.

, jika terus memanggil API, ralat kebenaran akan muncul.

1. Aktifkan perkhidmatan

Log masuk ke konsol Alibaba Cloud, cari

“Perkhidmatan SMS”

,Klik untuk mengaktifkan (Pengaktifan adalah percuma, penghantaran dikenakan bayaran mengikut jumlah mesej; disyorkan agar anda turut membeli pakej berharga beberapa puluh yuan).

2. Permohonan tandatangan SMS (Siapakah anda)

Masuk ke konsol perkhidmatan SMS, di sebelah kiri klik “Mesej Domestik” $\rightarrow$ “Pengurusan Tandatangan” $\rightarrow$ “Tambah Tandatangan”.

Nama tanda tangan: Biasanya ialah nama laman web anda, nama aplikasi atau singkatan syarikat (contohnya, Geeker Blog).

Sumber pengesahan: Pembangun individu lazimnya memilih “laman web yang telah didaftarkan” atau “aplikasi sebenar”, dan perlu menyediakan

Nombor pendaftaran ICP anda atau tangkapan skrin aplikasi.

3. Memohon templat SMS (apa yang anda hantar)

Tukar ke “Pengurusan Templat” $\rightarrow$ “Tambah Templat”.

Jenis Templat: Pilih "Kod Pengesahan".

Nama templat: Seperti kod pengesahan log masuk.

Kandungan templat: format tetap, pemboleh ubah diwakili oleh ${code}. Contohnya: anda log masuk ke sistem, kod pengesahan adalah: ${code}, yang sah dalam masa 5 minit, jangan sampaikan kepada orang lain.

Hantar untuk semakan, biasanya 10~ Anda boleh lulus dalam 30 minit. Ingat melalui TemplateCode (seperti SMS_1234567).

Langkah 2: Pemasangan teras Spring Boot belakang (3 minit)

Jangan gunakan SDK versi lama yang sudah usang lagi, kita terus menggunakan yang terkini daripada Alibaba Cloud.

V2.0

Java SDK asli awan, kodnya lebih ringkas.

1. Pengenalan kebergantungan Maven

Projek Spring Boot anda

pom.xml

Memperkenalkan perpustakaan teras SMS Alibaba Cloud:

XML

<groupId>com.aliyun</groupId>

<ArtifactId> dysmsapi20170525</artifactId>

2. Konfigurasi kunci dalam application.yml

Ingat prinsip kebenaran minimum RAM yang kita bicarakan dalam isu terakhir? Pergi ke konsol RAM Alibaba Cloud untuk mencipta akaun anak, dan hanya berikan

AliyunDysmsFullAccess

(Pengurusan SMS) Kebenaran, menghasilkan satu set AK/SK dan isikan di sini:

YAML

Aliyun:

sms:

Access-key-id: LTAI5tXXXXXXXXXXXX # sub-akaun AK

Akses-kunci-kunci: Pn7yXXXXXXXXXXXX # sub-akaun SK

Tanda-nama: Geek Blog # Tanda tangan yang anda lamar

template-kod: SMS_1234567 # ID templat yang telah diluluskan untuk permohonan anda

3. Mengemas kini kelas utiliti penghantaran SMS

Cipta sebuah Perkhidmatan, terus salin kod padat dan ringkas yang telah saya ringkaskan serta optimakan di bawah ini:

Java

import com.aliyun.dys

msapi20170525.Klien;

import com.aliyun.dysmsapi20170525.models.SendSmsRequest;

import com.aliyun.dysmsapi20170525.models.SendSmsResponse;

import com.aliyun.teaopenapi.models.Config;

import org.springframework.beans.factory.annotation.Value;

import org.springframework.stereotype.Service;

@Layanan

kelas awam SmsService {

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

peribadi String accessKeyId;

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

Private String accessKeySecret;

@Nilai("${aliyun.sms.pengesahan-nama}")

peribadi String namaTandatangan;

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

Private String templateCode;

/**

* Hantar SMS kod pengesahan

* @param phone Nombor telefon tujuan

* @param code Kod pengesahan rawak

Awam boolean sendVerifyCode(String phone, String code) {

cuba {

// 1. Memulakan pelanggan konfigurasi

Config config = baru Config()

. tetapkanAksesKeyId(aksesKeyId)

. tetapkanKataLaluanAksesRahsia(kataLaluanAksesRahsia);

// Titik akses perkhidmatan SMS tetap

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

Client client = Client baru (config);

// 2. Memasang parameter permintaan

PermintaanHantarSms permintaan = new PermintaanHantarSms()

. SetPhoneNumbers (phone)

. SetSignName (SignName)

. tetapkanKodTemplat(kodTemplat)

// Pembolehubah mesti ditukar kepada format rentetan JSON

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

// 3. Lakukan penghantaran

SendSsResponse response = client.sendSms(request);

// 4. Menilai keputusan penghantaran

jika ("OK".equals(response.getBody().getCode())) {

Kembali benar;

} lain {

System.err.println("Penghantaran SMS gagal, sebab: "+ response.getBody().getMessage());

pulangkannya palsu;

}

} tangkap (Exception e) {

e.printStackTrace();

pulangkannya palsu;

}

4. Menulis antara muka perniagaan Controller

Di lapisan Controller, dengan menggabungkan Redis anda (di sini menggunakan kod semu untuk mewakili gelung logik penuh):

Java

@RestController

@PermintaanM

menghantar permintaan("/api/sms")

kelas awam SmsController {

@Autowired

Private SssService smsService;

@Autowired

private StringRedisTemplate redisTemplate; // Sisipkan Redis

@PostMapping("/hantar")

public ResponseEntity<String> hantarKod(@RequestParam String telefon) {

// 1. Pengesahan biasa nombor telefon bimbit sederhana

jika (! Telefon. matches("^ 1[3-9]\ \ d{9}$") {

pulang ResponseEntity.badRequest().body("Format nombor telefon bimbit tidak betul");

}

// 2. Mekanisme anti-berus: periksa Redis untuk mengesahkan bahawa tidak ada penghantaran berulang dalam 60 saat

If (Boolean.TRUE.equals(redisTemplate.hasKey("SMS_LIMIT:" phone))) {

Kembali ResponseEntity.status (HtpStatus. TOO_MANY_REQUESTS). badan ("Hantar terlalu kerap, sila cuba kemudian");

}

// 3. Menghasilkan kod pengesahan nombor rawak 6 digit

Kod String = String.valueOf((int)((Math.random() * 9 1) * 100000));

// 4. Panggil perkhidmatan Alibaba Cloud untuk menghantar

Boolean isSuccess = smsService.sendVerifyCode(phone, code);

jika (! adakahBerjaya) {

pulangan ResponseEntity.status(500).body("Gagal menghantar SMS, sila hubungi pentadbir");

}

// 5. Simpan dalam Redis, tetapkan tempoh sah selama 5 minit; pada masa yang sama tetapkan satu

Had anti-berus 60 saat

redisTemplate.opsForValue().set("SMS_CODE:" + telefon, kod, 5, TimeUnit.MINUTES);

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

Semula ResponseEntity.ok("Kod pengesahan berjaya dihantar");

}

Langkah 3: Penulisan komponen undur Vue depan (1 minit)

Bahagian belakang selesai. Di bahagian depan, kita perlu mengelakkan pengguna mengklik butang "kirim", dan kita perlu membuat undur 60 saat standard.

Di sini dengan

Vue 3 (API Komposisi) Axios

Sebagai contoh, terus sahaja kepada kod yang paling mudah difahami:

Kod segmen

{{ adakah sedang mengira? '${countdown} saat kemudian dapatkan semula': 'Dapatkan kod pengesahan' }}

</butang>

</div>

</templat>

import { ref} dari 'vue';

Import axios dari 'axios';

Const phone = p ('');

satu perhitungan detik telah dirujuk kepada 60;

const isCounting = ref(false);

biarkan pemasa = null;

const handleSend = async () => {

jika (! /^1[3-9]\d{9}$/.test(phone.value)) {

Alert ('sila masukkan nombor telefon yang betul');

kembali;

}

cuba {

// Panggil antara muka belakang

Const res = awa

It axios.post('/api/sms/send? Telefon = $ {telefon. nilai} ');

Alert (res.data);

// Aktifkan undur

StartCountdown ();

} Catch (error) {

Alert (error.response?. Data | | 'Permintaan gagal ');

}

};

Const startCountdown = () => {

IsCounting. nilai = benar;

Akaun. nilai = 60;

Timer = setInterval(() => {

Akaun. nilai-;

If (coundown. value <= 0) {

ClearInterval (timer);

IsCounting. nilai = false;

}

}, 1000);

};

</Skrip>

Panduan untuk mengelakkan lubang di persekitaran pengeluaran (pengalaman operasi dan penyelenggaraan darah dan air mata)

Hati-hati bahawa antara muka "dihujani oleh SMS" oleh penggodam! Sebaik sahaja antara muka dalam talian, penggodam akan menggunakan skrip automatik untuk memegang puluhan ribu nombor telefon bimbit rawak untuk meminta antara muka/api/sms/akhir anda. Anda boleh memotong baki akaun Alibaba Cloud anda dalam satu malam. Pertahanan undang-undang besi: Selain penghitungan 60 saat di bahagian depan dan had frekuensi 60 saat nombor telefon bimbit tunggal di bahagian belakang, "kod pengesahan grafik" atau "pengesahan gelangsar manusia-mesin" mesti ditambahkan secara paksa untuk antara muka yang menghantar pesanan teks. Hanya permintaan undang-undang untuk kejayaan teka-teki, bahagian belakang menghantar mesej.

Mencetuskan "had frekuensi" Alibaba Cloud untuk melaporkan ralat. Alibaba Cloud SMS rasmi dilengkapi dengan satu set mekanisme anti-swiping kawalan aliran (tidak lebih dari 1 nombor telefon bimbit tunggal dalam 1 minit, tidak lebih dari 5 dalam 1 jam, dan tidak lebih dari 10 dalam 1 hari). Sekiranya anda menghantar pesanan teks gila semasa ujian tempatan dan tiba-tiba melaporkan kesalahan isv.BUSINESS_LIMIT_CONTROL, jangan panik, bukan kerana kodnya salah, anda dihalang oleh aliran rasmi Alibaba Cloud, dan ia akan disekat secara automatik esok.

Dengan gelung tertutup depan dan belakang ini, aplikasi perkhidmatan mikro anda secara rasmi akan mempunyai kemampuan pemberitahuan pesanan ringkas yang sesuai dan selamat. Cepat dan cuba!