How to Integrate Lovable with Bandwidth

Sign in to the Bandwidth Dashboard at dashboard.bandwidth.com. Your Account ID is displayed prominently at the top of the main dashboard page — it is a numeric identifier like 12345678. Next, navigate to 'Account' → 'API Credentials' in the left sidebar. Here you will find your API Token (username) and API Secret (password). These are used together for HTTP Basic Auth on all Bandwidth API v2 requests. You also need to note your Messaging Application ID. Go to 'Applications' in the left sidebar and find or create a Messaging Application — this is a Bandwidth configuration entity that links your phone numbers to a callback URL. The Application ID is a UUID like a1b2c3d4-e5f6-7890-abcd-ef1234567890. If you do not have an application yet, create one now and associate your purchased Bandwidth phone number to it. The callback URL will be your inbound webhook Edge Function URL, which you will configure in a later step.

In your Lovable editor, click the '+' icon near the top-right to open the panel selector, then choose the Cloud tab. Scroll to the 'Secrets' section and add four secrets by clicking the '+' button next to Secrets for each one. Name the first secret BANDWIDTH_ACCOUNT_ID and paste your numeric Account ID. Name the second BANDWIDTH_API_TOKEN and paste your API Token. Name the third BANDWIDTH_API_SECRET and paste your API Secret. Name the fourth BANDWIDTH_APPLICATION_ID and paste your Messaging Application ID. Name the fifth BANDWIDTH_FROM_NUMBER and paste your Bandwidth phone number in E.164 format (e.g. +12025551234). Secret names must match exactly what your Edge Function will call with Deno.env.get(). Bandwidth uses Basic Auth where the username is the API Token and the password is the API Secret — both are required. Lovable's security layer encrypts all secrets at rest and prevents them from appearing in generated code. The platform actively blocks approximately 1,200 hardcoded API keys per day, so always use the Secrets panel rather than pasting credentials into chat prompts or code fields.

Use the Lovable chat to generate the SMS Edge Function. The function must construct an HTTP Basic Auth header from the API Token and Secret (using btoa), then POST to Bandwidth's messaging endpoint at https://messaging.bandwidth.com/api/v2/users/{accountId}/messages. The request body is JSON with applicationId, to (array of destination numbers), from (your Bandwidth number), and text. Bandwidth's Messaging API v2 returns a 202 Accepted status on success (not 200), with a response body containing the message ID. Your Edge Function should parse this and return the messageId to your Lovable frontend. For MMS, add media (array of URLs) and omit the text field or include both. The API supports up to 10 recipient numbers per request for group messaging, though each number is billed separately. After Lovable deploys the function, test it from the Lovable chat by asking it to add a simple test trigger, or verify in Cloud → Logs that the function is deploying without errors.

1// supabase/functions/bandwidth-sms/index.ts
2import { serve } from 'https://deno.land/std@0.168.0/http/server.ts';
3
4const corsHeaders = {
5  'Access-Control-Allow-Origin': '*',
6  'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey, content-type',
7};
8
9serve(async (req) => {
10  if (req.method === 'OPTIONS') {
11    return new Response('ok', { headers: corsHeaders });
12  }
13
14  try {
15    const accountId = Deno.env.get('BANDWIDTH_ACCOUNT_ID')!;
16    const apiToken = Deno.env.get('BANDWIDTH_API_TOKEN')!;
17    const apiSecret = Deno.env.get('BANDWIDTH_API_SECRET')!;
18    const applicationId = Deno.env.get('BANDWIDTH_APPLICATION_ID')!;
19    const fromNumber = Deno.env.get('BANDWIDTH_FROM_NUMBER')!;
20
21    const { to, text } = await req.json();
22
23    const credentials = btoa(`${apiToken}:${apiSecret}`);
24
25    const response = await fetch(
26      `https://messaging.bandwidth.com/api/v2/users/${accountId}/messages`,
27      {
28        method: 'POST',
29        headers: {
30          'Authorization': `Basic ${credentials}`,
31          'Content-Type': 'application/json',
32        },
33        body: JSON.stringify({
34          applicationId,
35          to: [to],
36          from: fromNumber,
37          text,
38        }),
39      }
40    );
41
42    // Bandwidth returns 202 on success
43    if (response.status !== 202 && !response.ok) {
44      const error = await response.text();
45      throw new Error(`Bandwidth API error ${response.status}: ${error}`);
46    }
47
48    const data = await response.json();
49
50    return new Response(
51      JSON.stringify({ messageId: data.id, status: 'queued' }),
52      { headers: { ...corsHeaders, 'Content-Type': 'application/json' } }
53    );
54  } catch (error) {
55    return new Response(
56      JSON.stringify({ error: error.message }),
57      { status: 500, headers: { ...corsHeaders, 'Content-Type': 'application/json' } }
58    );
59  }
60});

When someone replies to your Bandwidth number or sends an inbound SMS, Bandwidth posts a JSON callback to the URL you configured in your Messaging Application. You need a second Edge Function to receive these callbacks, validate they are from Bandwidth, and store the inbound messages in your Supabase database. Create a second Edge Function called bandwidth-inbound. This function receives POST requests from Bandwidth with a JSON array of message event objects. Each event contains type (message-received), message.id, message.from, message.to, message.text, and message.time. Parse the array, extract the relevant fields, and insert a row into your Supabase database using the service role key for server-side writes. After deploying the Edge Function, copy its URL from Cloud → Edge Functions. Go back to Bandwidth Dashboard → Applications → your Messaging Application, and paste the Edge Function URL as the 'Inbound Message Callback' URL. Set the callback method to POST. Bandwidth will now forward all inbound SMS events to your Edge Function. Test by sending a text message to your Bandwidth number from any phone.