# Inbound Messages with Flex WebChat UI

> \[!NOTE]
>
> This guide is for Flex UI 1.x.x and channels that use Programmable Chat and Proxy. Programmable Chat for Flex will reach end of life on June 1, 2026. If you're new to Flex or currently using Programmable Chat, [build with Flex Conversations](/docs/flex/conversations) or [migrate](/docs/flex/developer/conversations/programmable-chat-to-flex-conversations).

Webchat is a common channel that customers use to communicate with a Flex agent. The [Flex Webchat UI](/docs/flex/developer/messaging/webchat/setup) offers you a way to embed chat on your website and manage messaging orchestration.

Any inbound messages sent with the Webchat widget get passed through to your contact center. The end user using the widget is generally unauthenticated, or anonymous. You can gather information through a [pre-engagement form](/docs/flex/developer/messaging/webchat/pre-engagement-and-context) before presenting the chat interface and pass the gathered meta-data to Studio, Flex, or your internal systems for validation and personalization.

In this use case, the Flex Flow and Studio Flow are available by default with standard Flex setup. The Flex Flow will be specified when configuring the Flex Webchat UI.

> \[!NOTE]
>
> The event flow detailed below is automatically handled by Twilio Webchat UI and requires no further integration. It is provided to show how the data passed from the Webchat UI is used when creating the Flex ChatChannel.

## How Inbound Webchat with Flex Works

First, Twilio creates an access token for the guest user.

* Flex Webchat UI uses standard Twilio token generation

  * Auto-generated token expires after one hour
  * The Flex Webchat UI will automatically renew this token before it expires

This doesn't require any coding on your part. Once the access token is created, Twilio orchestrates the relevant Chat engagement and Chat Channel, connects the Integration Type, and places the User into the Chat Channel. Twilio ensures other parts of the defined Message Handler are set.

* Channels are generated via the following endpoint: `https://flex-api.twilio.com/v1/WebChannels`
* This request uses the Access Token that the Webchat UI generated in the first step

If you have [configured a pre-engagement with the Webchat UI](/docs/flex/developer/messaging/webchat/pre-engagement-and-context), Flex will pass the pre-engagement data as a part of this request.

How Flex Creates the Webchannel

```js
// Download the helper library from https://www.twilio.com/docs/node/install
const twilio = require("twilio"); // Or, for ESM: import twilio from "twilio";

// Find your Account SID and Auth Token at twilio.com/console
// and set the environment variables. See http://twil.io/secure
const accountSid = process.env.TWILIO_ACCOUNT_SID;
const authToken = process.env.TWILIO_AUTH_TOKEN;
const client = twilio(accountSid, authToken);

async function createWebChannel() {
  const webChannel = await client.flexApi.v1.webChannel.create({
    chatFriendlyName: "ChatFriendlyName",
    customerFriendlyName: "CustomerFriendlyName",
    flexFlowSid: "FOaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
    identity: "Identity",
  });

  console.log(webChannel.accountSid);
}

createWebChannel();
```

```python
# Download the helper library from https://www.twilio.com/docs/python/install
import os
from twilio.rest import Client

# Find your Account SID and Auth Token at twilio.com/console
# and set the environment variables. See http://twil.io/secure
account_sid = os.environ["TWILIO_ACCOUNT_SID"]
auth_token = os.environ["TWILIO_AUTH_TOKEN"]
client = Client(account_sid, auth_token)

web_channel = client.flex_api.v1.web_channel.create(
    flex_flow_sid="FOaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
    identity="Identity",
    customer_friendly_name="CustomerFriendlyName",
    chat_friendly_name="ChatFriendlyName",
)

print(web_channel.account_sid)
```

```csharp
// Install the C# / .NET helper library from twilio.com/docs/csharp/install

using System;
using Twilio;
using Twilio.Rest.FlexApi.V1;
using System.Threading.Tasks;

class Program {
    public static async Task Main(string[] args) {
        // Find your Account SID and Auth Token at twilio.com/console
        // and set the environment variables. See http://twil.io/secure
        string accountSid = Environment.GetEnvironmentVariable("TWILIO_ACCOUNT_SID");
        string authToken = Environment.GetEnvironmentVariable("TWILIO_AUTH_TOKEN");

        TwilioClient.Init(accountSid, authToken);

        var webChannel = await WebChannelResource.CreateAsync(
            flexFlowSid: "FOaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
            identity: "Identity",
            customerFriendlyName: "CustomerFriendlyName",
            chatFriendlyName: "ChatFriendlyName");

        Console.WriteLine(webChannel.AccountSid);
    }
}
```

```java
// Install the Java helper library from twilio.com/docs/java/install

import com.twilio.Twilio;
import com.twilio.rest.flexapi.v1.WebChannel;

public class Example {
    // Find your Account SID and Auth Token at twilio.com/console
    // and set the environment variables. See http://twil.io/secure
    public static final String ACCOUNT_SID = System.getenv("TWILIO_ACCOUNT_SID");
    public static final String AUTH_TOKEN = System.getenv("TWILIO_AUTH_TOKEN");

    public static void main(String[] args) {
        Twilio.init(ACCOUNT_SID, AUTH_TOKEN);
        WebChannel webChannel =
            WebChannel
                .creator("FOaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa", "Identity", "CustomerFriendlyName", "ChatFriendlyName")
                .create();

        System.out.println(webChannel.getAccountSid());
    }
}
```

```go
// Download the helper library from https://www.twilio.com/docs/go/install
package main

import (
	"fmt"
	"github.com/twilio/twilio-go"
	flex "github.com/twilio/twilio-go/rest/flex/v1"
	"os"
)

func main() {
	// Find your Account SID and Auth Token at twilio.com/console
	// and set the environment variables. See http://twil.io/secure
	// Make sure TWILIO_ACCOUNT_SID and TWILIO_AUTH_TOKEN exists in your environment
	client := twilio.NewRestClient()

	params := &flex.CreateWebChannelParams{}
	params.SetFlexFlowSid("FOaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa")
	params.SetIdentity("Identity")
	params.SetCustomerFriendlyName("CustomerFriendlyName")
	params.SetChatFriendlyName("ChatFriendlyName")

	resp, err := client.FlexV1.CreateWebChannel(params)
	if err != nil {
		fmt.Println(err.Error())
		os.Exit(1)
	} else {
		if resp.AccountSid != nil {
			fmt.Println(*resp.AccountSid)
		} else {
			fmt.Println(resp.AccountSid)
		}
	}
}
```

```php
<?php

// Update the path below to your autoload.php,
// see https://getcomposer.org/doc/01-basic-usage.md
require_once "/path/to/vendor/autoload.php";

use Twilio\Rest\Client;

// Find your Account SID and Auth Token at twilio.com/console
// and set the environment variables. See http://twil.io/secure
$sid = getenv("TWILIO_ACCOUNT_SID");
$token = getenv("TWILIO_AUTH_TOKEN");
$twilio = new Client($sid, $token);

$web_channel = $twilio->flexApi->v1->webChannel->create(
    "FOaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa", // FlexFlowSid
    "Identity", // Identity
    "CustomerFriendlyName", // CustomerFriendlyName
    "ChatFriendlyName" // ChatFriendlyName
);

print $web_channel->accountSid;
```

```ruby
# Download the helper library from https://www.twilio.com/docs/ruby/install
require 'twilio-ruby'

# Find your Account SID and Auth Token at twilio.com/console
# and set the environment variables. See http://twil.io/secure
account_sid = ENV['TWILIO_ACCOUNT_SID']
auth_token = ENV['TWILIO_AUTH_TOKEN']
@client = Twilio::REST::Client.new(account_sid, auth_token)

web_channel = @client
              .flex_api
              .v1
              .web_channel
              .create(
                flex_flow_sid: 'FOaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa',
                identity: 'Identity',
                customer_friendly_name: 'CustomerFriendlyName',
                chat_friendly_name: 'ChatFriendlyName'
              )

puts web_channel.account_sid
```

```bash
# Install the twilio-cli from https://twil.io/cli

twilio api:flex:v1:web-channels:create \
   --flex-flow-sid FOaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa \
   --identity Identity \
   --customer-friendly-name CustomerFriendlyName \
   --chat-friendly-name ChatFriendlyName
```

```bash
curl -X POST "https://flex-api.twilio.com/v1/WebChannels" \
--data-urlencode "FlexFlowSid=FOaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa" \
--data-urlencode "Identity=Identity" \
--data-urlencode "CustomerFriendlyName=CustomerFriendlyName" \
--data-urlencode "ChatFriendlyName=ChatFriendlyName" \
-u $TWILIO_ACCOUNT_SID:$TWILIO_AUTH_TOKEN
```

```json
{
  "flex_flow_sid": "FOaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
  "account_sid": "ACaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
  "sid": "CHaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
  "date_created": "2016-08-01T22:10:40Z",
  "date_updated": "2016-08-01T22:10:40Z",
  "url": "https://flex-api.twilio.com/v1/WebChannels/CHaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"
}
```

Subsequent messages exchanged are now being passed using the Chat SDK from the Webchat UI.