Browser Calls (Laravel)

Learn how to use Twilio Client to make browser-to-phone and browser-to-browser calls with ease. The unsatisfied customers of the Birchwood Bicycle Polo Co. need your help!

Read the full tutorial here!

Create a TwiML App

This project is configured to use a TwiML App, which allows us to easily set the voice URLs for all Twilio phone numbers we purchase in this app.

Create a new TwiML app at https://www.twilio.com/user/account/apps/add and use its Sid as the TWIML_APPLICATION_SID environment variable wherever you run this app.

Once you have created your TwiML app, configure your Twilio phone number to use it (instructions here).

If you don't have a Twilio phone number yet, you can purchase a new number in your Twilio Account Dashboard.

Run the application

1. Clone the repository and cd into it.

2. Install the application's dependencies with Composer

   $ composer install

3. The application uses PostgreSQL as the persistence layer. If you don't have it already, you should install it. The easiest way is by using Postgres.app.

4. Create a database.

   $ createdb browser_calls

5. Copy the sample configuration file and edit it to match your configuration.

   $ cp .env.example .env

   You'll need to set DB_HOST, DB_DATABASE, DB_USERNAME, and DB_PASSWORD. You can often leave DB_USERNAME and DB_PASSWORD blank. DB_HOST should be localhost if you're running the DB in your own machine.

   You can find your TWILIO_ACCOUNT_SID and TWILIO_AUTH_TOKEN under your Twilio Account Settings. Set TWILIO_APPLICATION_SID to the app SID you created before. TWILIO_NUMBER should be set to the phone number you purchased above.

6. Generate an APP_KEY:

   $ php artisan key:generate

7. Run the migrations:

   $ php artisan migrate

8. Load the seed data:

   $ php artisan db:seed

9. Run the application using Artisan.

   $ php artisan serve

   It is artisan serve default behaviour to use http://localhost:8000 when the application is run. This means that the ip addresses where your app will be reachable on you local machine will vary depending on the operating system.

   The most common scenario, is that your app will be reachable through address http://127.0.0.1:8000, and this is important because ngrok creates the tunnel using only that address. So, if http://127.0.0.1:8000 is not reachable in your local machine when you run the app, you must tell artisan to use this address, like this:

   $ php artisan serve --host=127.0.0.1

10. Expose the application to the wider Internet using ngrok

    $ ngrok http 8000

    Once you have started ngrok, update your TwiML app's voice URL setting to use your ngrok hostname, so it will look something like this:

    https://<your-ngrok-subdomain>.ngrok.io/support/call
    

11. Go to https://<your-ngrok-subdomain>.ngrok.io to use this application.

    Note: Make sure you use the https version of your ngrok URL as some browsers won't allow access to the microphone unless you are using a secure SSL connection.

Dependencies

This application uses this Twilio helper library:

• twilio-php

Run the tests

1. Run at the top-level directory:

   $ phpunit