Build an Interactive Audio Live Streaming Experience
This guide describes how to set up an audio interactive live audio streaming application for iOS where you can join a Room as a moderator, speaker, or audience member. You will deploy a backend application that handles creating and joining Twilio Video Rooms and streaming the content, and run an iOS application that handles the moderator, speaker, and audience UI.
Requirements
- Node.js v14+
- NPM v7+ (upgrade from NPM 6 with
npm install --global npm
) - CocoaPods
- Xcode
Set up the backend application
First, clone the Live Interactive Audio GitHub repository.
Next, navigate into that cloned repository. Copy the .env.example
file in the root twilio-live-interactive-audio
directory and create a new file called .env
:
cp .env.example .env
Then, fill in the values in the .env
file:
ACCOUNT_SID
andAUTH_TOKEN
: Find these values on the Twilio Console landing page.TWILIO_API_KEY_SID
andTWILIO_API_KEY_SECRET
: Create a new API key in the Twilio Console and use the key's SID and secret for these values.CONVERSATIONS_SERVICE_SID
: This application uses Twilio Conversations to power an in-app chat functionality. Create a new Conversations Service in the Twilio Console, or use the SID of your account's default Conversation Service (also found in the Console).PASSCODE
: Update this value to be any six-digit numeric passcode. You will use this to access the streaming application.
Once you have collected and stored these values in the .env
file, you can install the project's dependencies:
npm install
Deploy the application
After the install is done, deploy the backend application:
npm run deploy
When the deploy is complete, the output will include a public URL for the deployed application. Make note of this URL, as you will need it in the next step when building the iOS audience application.
If you make any changes to this application, you can run npm run deploy
again to deploy the new changes to your application.
Run the iOS application
Set up the application
First, update the url
variable in the app source file to point to the public URL you received after deploying your application in the previous step.
//twilio-live-interactive-audio/apps/ios/LiveStream/LiveStream/API/Core/API.swift
class API {
static var shared = API()
private let session = Session()
private let jsonEncoder = JSONEncoder()
private let jsonDecoder = JSONDecoder()
private let url = <YOUR BACKEND URL HERE>
//...
Next, install the iOS application's dependencies with CocoaPods. Move to the apps/ios
folder within the main project directory and then install the project dependencies with CocoaPods:
cd apps/ios
pod install
Run the application
Use Xcode to run the application. Open the twilio-live-interactive-audio/apps/ios
project folder with Xcode and click the "Run" button within Xcode.
Once the application is running, enter a unique name and the passcode you set in the backend application.
You can then create a new room, which you will join as a speaker. Open a new simulator or join from a different device to test the audience view.
Need some help?
We all do sometimes; code is hard. Get help now from our support team, or lean on the wisdom of the crowd by visiting Twilio's Stack Overflow Collective or browsing the Twilio tag on Stack Overflow.