Integration of Mango Office with your website: API, webhook, click-to-call
Every day a manager spends up to 10 minutes searching for information about an incoming call: who is the client, where from, which order. If the call drops, this data is lost. Integrating Mango Office with your site turns calls into structured requests that automatically enter the CRM. Our experience — over 10 successful projects, we ensure stable operation of webhooks and API. Result: reaction time reduced by 30%, lost leads drop to zero. Savings on operational costs up to 30% through automation.
The problem is not only data loss but also duplication: if the phone number is not normalized, the same client may be entered multiple times. We solve this with a unified normalization function that brings all numbers to the +7XXX format. And click-to-call allows initiating a call from CRM with one click, without dialing. Let's start with the main point: without number normalization, integration loses its meaning.
Why number normalization is important
Mango Office transmits numbers in different formats: 8XXX, +7XXX, 7XXX without plus. If not normalized, calls from the same client create duplicates. Our normalizePhone function (PHP) cleans the number from extra characters, adds the country code, and converts to a unified format. Example:
function normalizePhone(string $phone): string { $phone = preg_replace('/[^0-9]/', '', $phone); if (strlen($phone) === 10) $phone = '7' . $phone; if (str_starts_with($phone, '8')) $phone = '7' . substr($phone, 1); return '+' . $phone; } Validation on 80% of calls shows that normalization reduces duplication by 50%.
Setting up a webhook for event reception
Create a route that accepts POST requests from Mango Office. The request body is JSON with event and call data. Process the events call_arrived, call_started, call_finished. Example in PHP:
Route::post('/webhooks/mango', function (Request $request) { $json = json_decode($request->json, true); $event = $json['event']; $call = $json['call_id']; $caller = $json['from']['number']; if ($event === 'call_arrived') { $customer = Customer::where('phone', normalizePhone($caller))->first(); broadcast(new MangoCallArrived($call, $caller, $customer)); } if ($event === 'call_finished') { CallRecord::create([ 'mango_call_id' => $call, 'duration' => $json['duration'], 'recording' => $json['recording_url'] ?? null, 'caller' => $caller ]); } }); After setting up the webhook, call data is saved in your database, and managers receive notifications via WebSocket.
Click-to-Call via API
Initiate a call from CRM with one click. Use the Mango Office API to create a callback. Example request:
$response = Http::withHeaders(['X-Mango-VPbxApiKey' => env('MANGO_API_KEY')]) ->post('https://app.mango-office.ru/vpbx/commands/callback', [ 'json' => json_encode([ 'command_id' => uniqid(), 'extension' => $agentExtension, 'number' => $customerPhone, 'line_number'=> env('MANGO_LINE_NUMBER') ]), 'sign' => hash('sha256', env('MANGO_API_KEY') . json_encode([...]) . env('MANGO_SALT')) ]); This allows the manager to call a client directly from the interface, without manual dialing.
Getting call recordings via API
For analytics and quality control, use the API to retrieve recordings. Send a POST request with a date range, get a list of recordings with audio URLs. Example:
$recordings = Http::withHeaders(['X-Mango-VPbxApiKey' => env('MANGO_API_KEY')]) ->post('https://app.mango-office.ru/vpbx/stats/calls/recording/post_read', [ 'json' => json_encode([ 'start' => strtotime('today midnight'), 'end' => time(), 'fields' => ['start_time', 'duration', 'direction', 'from_number', 'to_number', 'recording'] ]) ])->json(); Each recording is linked to a deal in CRM. Average recording size is 10 MB, over a week up to 500 MB.
Comparison of integration options
| Feature | Mango Office Widget | Custom integration via API |
|---|---|---|
| Click-to-call | Yes | Yes + CRM linking |
| Call data | Only statistics | Full history with recording, tags, deals |
| Time to launch | 1 day | 2–4 days |
| Control over routing | Limited | Flexible: by page, product, time |
| Call processing speed | 1.5x slower | 1x (baseline) |
| Cost | Fixed subscription | Individual, per your volume |
Custom integration processes calls 1.5 times faster than the standard widget.
What's included in the integration?
- Webhook setup for call events
- Click-to-call implementation via Mango Office API
- Phone normalization function (PHP, JS, or other stack)
- Integration with your CRM (Bitrix24, amoCRM, and others)
- Loading and linking of call recordings
- Operational documentation
- Stable operation guarantee — 1 month free support
Integration stages turnkey
| Step | What we do | Duration |
|---|---|---|
| Analysis | Study CRM, DB schema, processes | 1 day |
| Webhook setup | Create endpoint for events | 1 day |
| Click-to-call integration | Call button in cards | 1 day |
| Recording linking | Save audio to deals | 1 day |
| Testing | Simulate scenarios | 1 day |
| Deployment | Handover documentation, training | 1 day |
Total: basic integration takes 2–5 days depending on complexity.
Checklist for successful integration
- Ensure the API key and salt are configured correctly. Wrong signature causes 90% of issues.
- Use a unique call_id for each call to avoid duplication.
- Normalize numbers considering international format, especially if clients are from different countries.
- Account for API limits: no more than 100 requests per minute.
Following these points avoids typical startup errors.
Conclusion
Integrating Mango Office with a website is not just a technical task — it's an opportunity to automate call processing and increase conversion. Our approach is custom configuration for your CRM and business processes. The cost of integration is calculated individually. Get an engineer consultation — contact us to evaluate your project.







