friendm / browser-calls-flask

A sample application which shows you how to make and receive phone calls with a browser and Twilio Client

Browser Calls for Python - Flask

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!

Quickstart

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 here 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.

Local development

This project is built using the Flask web framework. It runs on Python 2.7+ and Python 3.4+.

1. To run the app locally, first clone this repository and cd into it.

2. Create a new virtual environment.

   • If using vanilla virtualenv:

     $ virtualenv venv
     $ source venv/bin/activate

   • If using virtualenvwrapper:

     $ mkvirtualenv browser-calls

3. Install the requirements.

   $ pip install -r requirements.txt

4. Copy the .env.example file to .env, and edit it including your credentials for the Twilio API (found at https://www.twilio.com/user/account/settings). You will also need a Twilio Number and TwiML App SID you made above.

5. Run source .env to apply the environment variables (or even better, use autoenv)

6. Run the migrations.

   $ python manage.py db upgrade

7. Modify seed data.

   We have provided an example of name and phone number in the seed data. In order for the application to send SMS notifications, you must edit this seed data providing a real phone number where you want the SMS notifications to be received.

   In order to do this, you must modify this file that is located at: project_root/manage.py

8. Seed the database.

   $ python manage.py dbseed

9. Start ngrok

   To actually forward incoming calls, your development server will need to be publicly accessible. We recommend using ngrok to solve this problem.

   $ ngrok http 5000

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

   http://88b37ada.ngrok.io/support/call
   

10. Start the development server.

    $ python manage.py runserver

Once ngrok is running, open up your browser and go to your ngrok URL. It will look like this: http://88b37ada.ngrok.io

That's it!

Run the tests

You can run the tests locally through coverage:

1. Run the tests.

   $ coverage run manage.py test
   

You can then view the results with coverage report or build an HTML report with coverage html.

Meta

• No warranty expressed or implied. Software is as is. Diggity.
• MIT License
• Lovingly crafted by Twilio Developer Education.