Styjun

Context: Twilio Browser-to-Phone calling API

What I am trying to achieve:

On click of the 'call customer' button, get a new page to pop up containing the calling functionality (i.e., the status bar, the 'answer call' button and the 'hang up' button) and then the call should connect.

What is happening:

The new page does pop up and the call ringing starts:

but after a while I get the 'Sorry, an application error occurred' message.

On inspecting the error in the debugger I found that I have been getting "Error-12100" messages. Every time I correct one, another error comes up pointing to a flaw in the some part of the code (of the template being rendered).

The errors include messages such as

"The element type "link" must be terminated by the matching end-tag "</link>". "

'the entity "copy" was referenced, but not declared.'

"Attribute name "disabled" associated with an element type "button" must be followed by the ' = ' character. "

"The element type "meta" must be terminated by the matching end-tag " <meta> ". "

"DOCTYPE is disallowed when the feature "http://apache.org/xml/features/disallow-doctype-decl" set to true. "

and so on, even though this code is almost identical to the one on the repository: https://github.com/TwilioDevEd/browser-calls-django.

I feel that the error should be something small that is triggering all of this, but could not find an open quotation mark or anything of the sort. Any help would be appreciated.

Notes:

1. I am using ngrok and that seems to be configured correctly in the Django app and the Twiml app




2. The way I am referencing a js file from one of the templates (the one where the bugs seem to be according to Twilio) is:

% block page_js %
 % load static %
 <script src="% static 'js/in_progress.js' %"></script>
% endblock %

3. I am passing the phone number through the newWindow attribute as:

 newWindow=window.open(url,'title','height=300,width=500');
 if (window.focus) newWindow.focus()
 newWindow.phoneNumber=phoneNumber

and then accessing this phoneNumber property in newWindow. The number reaches the new window correctly, but I'm not sure if it's in the format that Twilio requires (and don't know how to verify this)

Twilio developer evangelist here.

The issue seems to be that Twilio is sending a webhook to your application to find out what to do with the call and it is not getting back something it expects. You should be returning TwiML but given the errors it looks like you are returning HTML. I would check the URL you have set up in your TwiML application and what it is responding to requests with.

The part of the example app that you linked to that should be returning this TwiML is here: https://github.com/TwilioDevEd/browser-calls-django/blob/master/browser_calls/views.py#L58-L71.

Let me know if that helps at all.