שילוב טלפוניית SIP: WebRTC, לחיצה-כדי-לחייג ו-CRM

שילוב טלפוניית SIP עם האתר שלך

SIP (Session Initiation Protocol) הוא התקן לטלפוניית IP. שילוב טלפוניית SIP עם אתר מאפשר לך לקבל ולבצע שיחות ישירות מהדפדפן באמצעות WebRTC, לקשר שיחות להזמנות ולקוחות, ולשמור היסטוריית אינטראקציות. יישמנו עשרות אינטגרציות כאלה בפרויקטים בקנה מידה שונים — מחנויות מקוונות ועד מוקדי שירות עם 500+ נציגים.

למה עסקים צריכים SIP בדפדפן?

תרחיש טיפוסי: נציג עובד ב-CRM, רואה הזמנת לקוח ורוצה להתקשר מיד. ללא אינטגרציה, הוא מבזבז עד 3 דקות בחיפוש איש הקשר; עם click-to-call — 10 שניות. בשיחות נכנסות, ה-CRM מציג מי מתקשר לפני שאתה אפילו עונה. זה מאיץ את עיבוד ההזמנות ב-30–40% ומבטל שגיאות חיוג. במוקד שירות עם 100 נציגים, חיסכון בזמן מסתכם בכ-200 שעות בחודש.

ארכיטקטורה טיפוסית

Браузер (WebRTC) ←→ SIP Gateway (Asterisk/FreeSWITCH) ←→ SIP-провайдер ←→ ТСОП ↑ Сайт API (события, аналитика) 

לקוח ה-SIP בדפדפן עובד דרך WebRTC; שער ה-SIP ממיר WebRTC ל-SIP, ואז השיחה ממשיכה דרך ערוצי SIP רגילים. אנו משתמשים ב-Asterisk או FreeSWITCH כשער אמין — הניסיון שלנו מראה שמערכות מוגדרות כראוי יכולות להתמודד עם עד 2000 שיחות במקביל.

למה SIP.js? השוואה עם חלופות

SIP.js היא הספרייה הפופולרית ביותר ללקוח SIP בדפדפן. היא תומכת בכל הדפדפנים המודרניים ועובדת ביציבות תחת עומס. חלופות: JsSIP (פיתוח פחות פעיל), sipml5 (מיושן). SIP.js מנצחת במהירות הקמת החיבור — הבדיקות שלנו מראות שהיא יוזמת שיחה 20% מהר יותר מ-JsSIP עם אותה איכות שמע. בחירת הספרייה הנכונה היא קריטית עבור LCP ו-INP — המשתמש לא צריך לחכות.

SIP.js — לקוח דפדפן

// npm install sip.js
import { UserAgent, Inviter, SessionState } from 'sip.js';

const ua = new UserAgent({
  uri: UserAgent.makeURI('sip:[email protected]'),
  transportOptions: {
    server: 'wss://sip.yourpbx.ru:8089/ws'
  },
  authorizationUsername: sipLogin,
  authorizationPassword: sipPassword
});

await ua.start();

// Совершить звонок
const target = UserAgent.makeURI('sip:[email protected]');
const inviter = new Inviter(ua, target);

inviter.stateChange.addListener((state) => {
  if (state === SessionState.Established) {
    // Звонок установлен
  }
  if (state === SessionState.Terminated) {
    // Звонок завершён
  }
});

await inviter.invite();

כפתור Click-to-Call

בדף ההזמנה או בכרטיס הלקוח — כפתור "חייג":

document.getElementById('call-btn').addEventListener('click', async () => {
  // Запросить разрешение на микрофон
  const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
  const inviter = new Inviter(ua, UserAgent.makeURI(`sip:${phoneNumber}@pbx.ru`));
  await inviter.invite({
    sessionDescriptionHandlerOptions: {
      constraints: {
        audio: true,
        video: false
      }
    }
  });
});

חלון קופץ לשיחה נכנסת

כאשר שיחה נכנסת מגיעה דרך webhook של ה-PBX — הצג חלון קופץ עם נתוני לקוח:

// PBX отправляет webhook при входящем
Route::post('/webhooks/pbx/call', function (Request $request) {
    $callerPhone = $request->caller_number;
    // Найти клиента по номеру
    $customer = Customer::where('phone', $this->normalizePhone($callerPhone))->first();
    // Push через WebSocket к менеджеру
    broadcast(new IncomingCallEvent($callerPhone, $customer));
});

בצד הלקוח: Браузер (WebRTC) ←→ SIP Gateway (Asterisk/FreeSWITCH) ←→ SIP-провайдер ←→ ТСОП ↑ Сайт API (события, аналитика) — מציג חלון קופץ עם היסטוריית לקוח לפני מענה לשיחה.

הקלטת שיחות

בעת שימוש ב-Asterisk או FreeSWITCH — ההקלטות נשמרות כקובצי WAV/MP3, נתיב הקובץ מועבר דרך AMI/ESL. הקובץ מועתק ל-S3, והקישור נשמר ב-// npm install sip.js import { UserAgent, Inviter, SessionState } from 'sip.js'; const ua = new UserAgent({ uri: UserAgent.makeURI('sip:[email protected]'), transportOptions: { server: 'wss://sip.yourpbx.ru:8089/ws' }, authorizationUsername: sipLogin, authorizationPassword: sipPassword }); await ua.start(); // Совершить звонок const target = UserAgent.makeURI('sip:[email protected]'); const inviter = new Inviter(ua, target); inviter.stateChange.addListener((state) => { if (state === SessionState.Established) { // Звонок установлен } if (state === SessionState.Terminated) { // Звонок завершён } }); await inviter.invite(); :

call_records (
    id,
    call_id,
    customer_id,
    agent_id,
    started_at,
    duration_sec,
    recording_url,
    disposition: answered | noanswer | busy
)

איך אנו בודקים את האינטגרציה?

לפני המסירה, אנו מבצעים בדיקות עומס: 100+ שיחות במקביל, בדיקת LCP ו-TTFB של הדף במהלך שיחה. אנו גם בודקים תרחישים: ניתוק חיבור, ניסיון חוזר לשיחה, סירוב למיקרופון. זה מבטיח פעולה יציבה גם עם 500 שיחות ביום.

למה לבחור צוות מנוסה לאינטגרציה?

תצורת WebRTC שגויה מובילה לבעיות: ניתוק שיחות אחרי 30 שניות, ללא שמע, שיחות נכנסות שלא עובדות. הניסיון של המהנדסים שלנו מבטיח פעולה יציבה תחת עומס. אנו מספקים אחריות כתובה על האינטגרציה ומתקנים באגים ללא תשלום תוך 90 יום לאחר המסירה. קבל ייעוץ — ננתח את התרחיש שלך ונציע פתרון אופטימלי.

מה כלול בעבודה?

• ביקורת על תשתית ה-PBX והאינטרנט הקיימת — בדיקת גרסאות Asterisk/FreeSWITCH, זמינות WebSocket, פורטים פתוחים.
• התקנת לקוח SIP באתר — שילוב SIP.js או JsSIP, חיבור התקני שמע.
• פיתוח click-to-call — כפתור חיוג מ-CRM, חיוג אוטומטי למספר.
• Webhook לשיחות נכנסות — חלון קופץ עם נתוני לקוח, היסטוריית הזמנות.
• הקלטת שיחות — הגדרת ניטור, שמירת הקלטות, קישור לשיחות.
• תיעוד והדרכה — תיאור API, הוראות לנציגים, העברת גישה.
• תמיכה לאחר השקה — 14 ימים של סיוע חינם.

לוחות זמנים לפיתוח

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

איך אנו מבטיחים איכות?

• שימוש בספריות מוכחות — SIP.js, Asterisk, FreeSWITCH.
• בדיקות תחת עומס — 100+ שיחות במקביל, בדיקת LCP ו-TTFB.
• מתן תעודת התאמה — אישור שהאינטגרציה אינה משבשת את פעולת האתר.

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