Cum să programezi un SMS în Javascript
Cea mai simplă metodă de a trimite SMS-uri programate din JavaScript este utilizarea API-ului HTTP/Rest SMS integrat al Ozeki SMS Gateway. Când folosești acest API, vei trimite mesaje SMS prin efectuarea unei cereri HTTP Post către gateway-ul SMS. Cererea HTTP Post va conține un mesaj formatat în format json. Gateway-ul SMS va trimite acest SMS către numărul de telefon al destinatarului și va returna un răspuns HTTP 200 OK la cererea ta.
Exemplul de cod JavaScript pentru SMS de mai jos demonstrează cum poți trimite SMS-uri programate folosind API-ul http rest sms al Ozeki SMS Gateway cu ajutorul bibliotecii JavaScript Ozeki.Libs.Rest. Această bibliotecă este oferită gratuit și poți să o folosești și să o modifici în oricare dintre proiectele tale.
SendScheduledSms.php<?php header("Access-Control-Allow-Origin: *"); header('Access-Control-Allow-Credentials: true'); header('Access-Control-Max-Age: 86400'); header("Access-Control-Allow-Headers: Authorization, Accept, Content-Type"); header("Access-Control-Allow-Methods: GET, POST, OPTIONS"); ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Trimite SMS programat cu Ozeki SMS Gateway</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> <link rel="stylesheet" href="SendScheduledSms.css"> </head> <body> <div class="form-group form-container"> <b>ToAddress:</b> <input class="form-control" type="text" id="ToAddress" placeholder="+36201111111"> <b>Text:</b> <input class="form-control" type="text" id="Text" placeholder="Hello world!"> <b>TimeToSend:</b> <input class="form-control" type="text" id="TimeToSend" placeholder="2021-07-30 10:00:00"> <button class="btn btn-primary" id="btnSend"> <b>TRIMITE</b> </button> </div> <div class="log-container"> <ul class="card log" id="container"> <li class="list-group-item"><b>Jurnale:</b></li> </ul> </div> <script type="module"> import { Configuration, Message, MessageApi } from "./Ozeki.Libs.Rest.js"; var btnSend = document.getElementById("btnSend"); var configuration = new Configuration(); configuration.Username = 'http_user'; configuration.Password = 'qwe123'; configuration.ApiUrl = 'http://127.0.0.1:9509/api'; var api = new MessageApi(configuration); btnSend.addEventListener("click", async function() { if (document.getElementById("ToAddress").value != '' && document.getElementById("Text").value != '' && document.getElementById('TimeToSend').value) { var msg = new Message(); var datetime = (document.getElementById('TimeToSend').value).split(' '); var date = datetime[0].split('-'); var time = datetime[1].split(':'); msg.ToAddress = document.getElementById("ToAddress").value; msg.Text = document.getElementById("Text").value; msg.TimeToSend = new Date(Date.UTC(date[0], (parseInt(date[1].replace('0', ''))-1), date[2], time[0], time[1], time[2])); let result = await api.Send(msg); document.getElementById("ToAddress").value = ''; document.getElementById("Text").value = ''; document.getElementById('TimeToSend').value = ''; document.getElementById('container').innerHTML += `<li class="list-group-item">${result}</li>`; } }); </script> </body> </html>
Cum să folosești exemplul JavaScript pentru SMS:
Acest exemplu JavaScript pentru SMS poate fi folosit în orice aplicație web. Pentru a-l utiliza, trebuie să adaugi Ozeki.Libs.Rest.js în proiectul tău. După ce este adăugat în proiect, trebuie să introduci directiva import {MessageApi, Message, Configuration} from './Ozeki.Libs.Rest.js'; în secțiunea de antet a codului sursă JavaScript. Acest lucru îți va permite să folosești clasele furnizate de biblioteca Ozeki.Libs.Rest. Poți folosi clasa Message pentru a crea SMS-ul. Poți folosi clasa MessageApi pentru a trimite SMS-ul către gateway-ul SMS. Gateway-ul SMS va transmite mesajul tău către rețeaua mobilă fie printr-o conexiune wireless fie prin Internet.
Descarcă SendScheduledSms.js
Codul sursă explicat în acest articol poate fi descărcat, folosit și modificat gratuit.
Descarcă: SendScheduledSms.js.zip (5.59Kb)
Fișierul SendScheduledSms.js.zip conține biblioteca Ozeki.Libs.Rest, care îți oferă toate instrumentele necesare pentru a trimite și primi mesaje SMS. Vei găsi de asemenea proiectul SendScheduledSms în arhivă, care conține codul exemplu pentru a-ți arăta cum să trimiți un SMS. Acest cod exemplu este listat mai jos.
Cum să trimiți SMS din JavaScript (Ghid simplu)
Pentru a trimite SMS din JavaScript:
- Instalați un utilizator HTTP API
- Activați Log communication events în fila Advanced
- Configurați WampServer
- Descărcați apoi extrageți fișierul SendScheduledSms.js.zip
- Puneți conținutul fișierului zip în folderul \www\ al wampserver: C:\wamp64\www
- Lansați aplicația Ozeki SMS Gateway
- Deschideți site-ul tastând http://localhost/SendScheduledSms.php în browser
- După ce ați deschis site-ul, puteți trimite un SMS făcând clic pe butonul Send
- Verificați jurnalele pentru a vedea dacă SMS-ul a fost trimis
Instalați Ozeki SMS Gateway și creați un utilizator HTTP API
Pentru a putea trimite SMS din JavaScript, mai întâi trebuie să instalați Ozeki SMS Gateway. Gateway-ul SMS poate fi instalat pe același computer unde dezvoltați codul JavaScript în Visual Studio. După instalare, următorul pas este să conectați Ozeki SMS Gateway la rețeaua mobilă. Puteți creați un utilizator HTTP SMS API. Creați un utilizator cu numele de utilizator "http_user" și parola "qwe123" pentru ca exemplul să funcționeze fără modificări.
După ce mediul este configurat, puteți rula codul JavaScript.
URL HTTP API pentru a trimite SMS din JavaScript
Pentru a trimite SMS din JavaScript, codul JavaScript va trebui să trimită o cerere HTTP către gateway-ul SMS. URL-ul API este afișat mai jos. Rețineți că adresa IP (127.0.0.1) ar trebui să fie înlocuită cu adresa IP a gateway-ului SMS. Dacă Ozeki SMS Gateway este instalat pe același computer unde rulează aplicația JavaScript SMS, aceasta poate fi 127.0.0.1. Dacă este instalat pe un computer diferit, ar trebui să fie adresa IP a acelui computer.
http://127.0.0.1:9509/api?action=rest
Autentificare HTTP pentru a trimite SMS din JavaScript
Pentru a autentifica clientul JavaScript SMS, trebuie să trimiteți numele de utilizator și parola într-un șir codificat base64 către server într-o cerere HTTP. Formatul folosit este: base64(nume de utilizator+":"+parolă). În JavaScript puteți folosi următorul cod pentru a face această codificare:
// Puteți găsi codificatorul Base64 în fișierul Ozeki.Libs.Rest.js var usernamePassword = username + ":" + password; return `Basic ${Base64.encode(usernamePassword)}`;
De exemplu, dacă codificați numele de utilizator 'http_user' și parola 'qwe123', veți obține următorul șir codificat base64: aHR0cF91c2VyOnF3ZTEyMw==. Pentru a trimite
Antet cerere HTTP pentru a trimite SMS din JavaScript
Pentru a trimite mesajele SMS, trebuie să includeți următoarele linii ca antete în cererea HTTP. Rețineți că includem un antet Content-Type și un antet Authorization.
Content-Type: application/json Authorization: Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ==
Cerere HTTP pentru a trimite SMS din JavaScript
Pentru a trimite SMS-ul, aplicația JavaScript va trimite o cerere HTTP similară cu cea de mai jos. Rețineți că această cerere conține o parte de antet HTTP și o parte de corp HTTP. Corpul HTTP este un șir de date codificat JSON. Acesta conține numărul destinatarului, textul mesajului și ora la care dorim să trimitem mesajul nostru.
POST /api?action=sendmsg HTTP/1.1 Connection: close Content-Length: 418 Content-Type: text/plain;charset=UTF-8 Accept: */* Authorization: Basic aHR0cF91c2VyOnF3ZTEyMw== Host: 127.0.0.1:9509 User-Agent: node-XMLHttpRequest { "messages": [ { "message_id": "d4420450-3db1-1452-91eb-1145b2126495", "to_address": "+36201111111", "text": "Hello world!", "create_date": "2021-07-30T13:04:49", "vaild_date": "2021-08-06T13:04:49", "time_to_send": "2021-07-30T14:00:00", "submit_report_requested": true, "delivery_report_requested": true, "view_report_requested": true } ] }
Răspuns HTTP primit de exemplul JavaScript SMS
Odată ce gateway-ul SMS primește această cerere, va genera un răspuns HTTP. Răspunsul HTTP va conține un cod de stare, pentru a indica dacă cererea de trimitere SMS a fost reușită sau nu. De asemenea, va returna o structură codificată JSON pentru a vă oferi detalii utile despre trimiterea mesajului.
HTTP/1.1 200 OK User-Agent: OZEKI 10.3.123 (www.myozeki.com) Content-Type: application/json; charset=utf8 Last-Modified: Fri, 30 Jul 2021 12:58:47 GMT Server: 10/10.3.123 Transfer-Encoding: chunked { "http_code": 200, "response_code": "SUCCESS", "response_msg": "Messages queued for delivery.", "data": { "total_count": 1, "success_count": 1, "failed_count": 0, "messages": [ { "message_id": "d4420450-3db1-1452-91eb-1145b2126495", "from_station": "%", "to_address": "+36201111111", "to_station": "%", "text": "Hello world!", "create_date": "2021-07-30 13:04:49", "valid_until": "2021-08-06 13:04:49", "time_to_send": "2021-07-30 14:00:00", "submit_report_requested": true, "delivery_report_requested": true, "view_report_requested": false, "tags": [ { "name": "Type", "value": "SMS:TEXT" } ], "status": "SUCCESS" } ] } }
Cum să trimiți SMS programat din JavaScript folosind API-ul SMS JavaScript (Tutorial video)
Acest videoclip vă arată cum să descărcați fișierul SendScheduledSms.js.zip de pe această pagină. Dacă urmăriți videoclipul, veți observa că conținutul arhivei SendScheduledSms.js este plasat în folderul \www\ al WampServer. De asemenea, veți vedea că pornim WampServer făcând dublu clic pe pictograma sa, iar după aceasta introducem http://localhost:8080/SendScheduledSms.js în browserul web.
Exemplu SMS în JavaScript: SendScheduledSms.js
Codul exemplu de mai jos face parte din fișierul PHP SendScheduledSms.php.
Pe lângă acesta, veți vedea alte două fișiere numite SendScheduledSms.css și Ozeki.Libs.Rest.js.
- Fișierul Ozeki.Libs.Rest.js conține toate instrumentele necesare pentru a trimite, șterge, marca și primi mesaje SMS.
- SendScheduledSms.php conține codul JavaScript, precum și câteva anteturi care ne vor permite să trimitem cereri HTTP fără erori CORS.
- SendScheduledSms.css conține fișierul de stil pentru pagina web.
După ce SMS-ul a fost trimis, este bine să verifici gateway-ul SMS, pentru a vedea ce a primit. Poți verifica jurnalul deschizând detaliile utilizatorului HTTP din consola de management Ozeki SMS Gateway. Următorul videoclip îți arată ce să cauți. Videoclipul va începe cu codul deschis și se va încheia cu detaliile mesajului trimis. Vei învăța cum să lansezi proiectul, cum arată proiectul în timpul rulării și cum arată fișierul jurnal după aceasta. Videoclipul durează doar 42 de secunde și este ușor de înțeles. Nu vei avea probleme să-l urmărești.
Pe scurt
Acest articol a explicat cum să creezi o soluție pentru programarea SMS-urilor în JavaScript cu ajutorul utilizatorului HTTP al Ozeki SMS Gateway. Dacă ai citit totul cu atenție, programarea SMS-urilor ar trebui să fie foarte ușoară. Programarea SMS-urilor este benefică datorită faptului că împărtășești informații cu clienții atunci când aceștia au timp să acorde atenție mesajului tău. Va face marketingul prin SMS în masă mai eficient, și vei ajunge la mai mulți oameni cu acesta.
Află mai multe pe site-ul Ozeki și continuă să citești. Verifică cum să primești un SMS în JavaScript, te poate ajuta să îți organizezi depozitarea mesajelor.
Descarcă acum Ozeki SMS Gateway și vezi schimbarea!
More information
- Javascript send SMS with the HTTP rest API (code sample)
- Javascript send multiple SMS with the HTTP rest API (code sample)
- Javascript schedule SMS with the HTTP rest API (code sample)
- Javascript receive SMS with the HTTP rest API (code sample)
- Javascript delete SMS with the HTTP rest API (code sample)
- How to download the latest JavaScript SMS API library from Github