WCS v.0.5.28.2753-5.2.859 issue

jobs

New Member
Hi:
I am having some problems on WCS demo.
I step by step, follow the installation manual test to establish success. And import SSL certificates done. I am WCS can't support any mobile browser login, but use PC browser can login. I use mobile login https://demo.flashphoner.com/admin/login.html working fine.
Other test click to talk demo always click call hangup the caller automatically after 1 ring. check sip proxy CDR show hangup from caller.
Who can help fix it?
accounts.xml configuration:
<root mode="roundrobin">
<sip_server>
<domain>xxx.xxx.161.109</domain> <!--> mandatory parameter, load tool will not start without this <-->
<outbound_proxy>xxx.xxx.161.109</outbound_proxy> <!--> optional parameter, if not defined load tool will use domain <-->
<port>2080</port> <!--> optional parameter, if not defined load tool will use "5060" port <-->
<register_required>true</register_required> <!--> optional parameter <-->
</sip_server>
<!-->accounts definition examples<-->

<!-->load tool will not use account definition without login or password, if your proxy does no requires auth you must set it to some string anyway<-->
<account login="1353062222" password="6640716"/>
<!-->you can override global parameters in account parameters by defining them.<-->
<!-->In example below sip proxy address and outbound proxy address is overridden<-->
<account login="1353062222" password="6640716" outboundProxy="xxx.xxx.161.109" domain="xxx.xxx.161.109"/>
<!--> See full parameters list below<!-->
<!--account registerRequired="" login="" authenticationName="" password="" outboundProxy="" domain="" port="" visibleName=""/-->
</root>
 

Max

Administrator
Staff member
Hello

According this doc you have to put SIP credentials immediately using JavaScript

This approach does not look secure enough.
So you have to use REST Hooks as described here

XML configs are not supported in latest versions.
So to implement click to call you would need 1) latest release 2) REST Hooks https://flashphoner.com/click-to-call-from-demo-to-production
 

jobs

New Member
Hello

According this doc you have to put SIP credentials immediately using JavaScript

This approach does not look secure enough.
So you have to use REST Hooks as described here

XML configs are not supported in latest versions.
So to implement click to call you would need 1) latest release 2) REST Hooks https://flashphoner.com/click-to-call-from-demo-to-production
Hello
I step by step test Rest hooks and get error.

flashphoner.js:10364 The AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page. https://goo.gl/7K7WLu
init @ flashphoner.js:10364
flashphoner.js:14042 15:47:21 INFO webrtc - Initialized
flashphoner.js:14042 15:47:21 INFO websocket - Initialized
flashphoner.js:14042 15:47:21 INFO core - Initialized
Click-to-Call-min.js:23 Create new session with url wss://service.my-2222.xyz:8443
Click-to-Call-min.js:39 Uncaught TypeError: Cannot read property 'createCall' of undefined
at HTMLInputElement.call (Click-to-Call-min.js:39)
call @ Click-to-Call-min.js:39

How to fix it?

Thanks[/QUOTE]
 
Last edited:

Max

Administrator
Staff member
Click-to-Call-min.js:23 Create new session with url wss://service.my-2222.xyz:8443
Click-to-Call-min.js:39 Uncaught TypeError: Cannot read property 'createCall' of undefined
Seems like session failed to establish because your backend returns 403 Forbidden
1608714905818.png

Please check your backend.
 

Max

Administrator
Staff member
Means your back-end returns 403 Forbidden "ubnormalResponse" function. You have to check why your backend returns 403 Forbidden not 200 OK.

1608733726345.png
 

Max

Administrator
Staff member
What did i do wrong?
You should wrap connect() with playFirstVideo() function to work in iOS Safari:
Code:
function init_page(){
Flashphoner.init({});
localAudio = document.getElementById("localAudio");
remoteAudio = document.getElementById("remoteAudio");
if (Browser.isSafariWebRTC() && Flashphoner.getMediaProviders()[0] === "WebRTC") {
    Flashphoner.playFirstVideo(localDisplay, true, PRELOADER_URL).then(function () {
         Flashphoner.playFirstVideo(remoteDisplay, false, PRELOADER_URL).then(function () {
               connect();
         });
    });
    return;
} else {
    connect();
}
}
If I want to send a string of numbers from the test URL to the clicl-to-talk API as a sip callerid or a dispaly name, what should I do? I didn't find the relevant parameters in the API.
You should add parameters to createCall(), for example
Code:
var outCall = session.createCall({
callee: getUrlParam("callee"),
visibleName: getUrlParam("visibleName"),
remoteVideoDisplay: remoteAudio,
localVideoDisplay: localAudio,
constraints: constraints,
stripCodecs: "SILK"
});
 

jobs

New Member
You should wrap connect() with playFirstVideo() function to work in iOS Safari:
I update code to Click-to-Call-min.js got error.
Click-to-Call-min.js:11 Uncaught ReferenceError: Browser is not defined
at init_page (Click-to-Call-min.js:11)
at onload (3.html:20)
var outCall = session.createCall({ callee: getUrlParam("callee"), visibleName: getUrlParam("visibleName"), remoteVideoDisplay: remoteAudio, localVideoDisplay: localAudio, constraints: constraints, stripCodecs: "SILK" });
same get error "Uncaught ReferenceError: Browser is not defined"
 

Max

Administrator
Staff member
The example in article is very basic, and it contains no additional utils to detect browser. Please refer to Phone example source code on GitHub.
You should use WebSDK in /usr/local/FlashphonerWebCallServer/client2 folder on WCS server. You should take from WCS server and include at least the following scripts to HTML file
Code:
client2/flashphoner.js
client2/examples/demo/dependencies/js/utils.js
Or you should implement browser detection procedure in Click-to-Call.js file:
Code:
function isSafariWebRTC() {
    return navigator.mediaDevices && /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
}
You should also provide a preloader for playFurstVideo to work
Code:
var PRELOADER_URL = "preloader.mp4";
The example plreloader is shipped in file /usr/local/FlashphonerWebCallServer/client2/examples/demo/dependencies/media/preloader.mp4 on WCS server
 

jobs

New Member
Click-to-Call.js file add
JavaScript:
var SESSION_STATUS = Flashphoner.constants.SESSION_STATUS;
var CALL_STATUS = Flashphoner.constants.CALL_STATUS;
var PRELOADER_URL = "../../dependencies/media/preloader.mp4";
var localAudio;
var remoteAudio;

function isSafariWebRTC() {
    return navigator.mediaDevices && /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
}

function init_page(){
Flashphoner.init({});
localAudio = document.getElementById("localAudio");
remoteAudio = document.getElementById("remoteAudio");
if (Browser.isSafariWebRTC() && Flashphoner.getMediaProviders()[0] === "WebRTC") {
    Flashphoner.playFirstVideo(localDisplay, true, PRELOADER_URL).then(function () {
         Flashphoner.playFirstVideo(remoteDisplay, false, PRELOADER_URL).then(function () {
               connect();
         });
    });
    return;
} else {
    connect();
}
}
iphone can not make call and register to sip proxy .
about html add
Code:
<title>web2call</title>
    <script type="text/javascript" src="../../../../flashphoner.js"></script>
    <script type="text/javascript" src="../../dependencies/jquery/jquery-1.12.0.js"></script>
    <script type="text/javascript" src="../../dependencies/js/utils.js"></script>
   
    <!-- Bootstrap -->
    <script src="../../dependencies/bootstrap/js/bootstrap.js"></script>

    <!-- Minimum script for calls -->
    <script type="text/javascript" src="click-to-call-min.js"></script>
Please see attachment
Thanks
 
Last edited:

Max

Administrator
Staff member
Please provide browser console log to check.
Also make sure that all the files you include in script tag are placed by its paths.
 

jobs

New Member
Hi
My current click-to-talk website deployment test is as follows table:

Equipment
Chrome​
Safair​
Edge​
PCTwo-way soundTwo-way soundTwo-way sound
MacbookTwo-way soundTwo-way soundN/A
iPadTwo-way soundTwo-way soundN/A
Android mobileTwo-way soundTwo-way soundN/A
iPhone 7 , iPhone 8no soundno soundN/A

iPhone 7 , iPhone 8 debug and click Allow microphone permissions and mak call answer got air. error form flashphoner.js
截圖 2020-12-29 下午10.19.13.png
 

Max

Administrator
Staff member
The problem seems to be in your Javascript code.
Please check if the problem is reproducing in Phone Min example. If not, please provide SSH access to WCS server and to frontend using this private form, we will check.
 

Max

Administrator
Staff member
We checked your code and found some errors
1. 3.html file
You've set a wrong paths to include scripts. The paths in examples are relative to example folders. You've placed main html and js files to web server root folder. So instead of this
Code:
    <script type="text/javascript" src="../../dependencies/jquery/jquery-1.12.0.js"></script>
    <script type="text/javascript" src="../../dependencies/js/utils.js"></script>
    
    <!-- Bootstrap -->
    <script src="../../dependencies/bootstrap/js/bootstrap.js"></script>
you should write like this
Code:
    <script type="text/javascript" src="examples/demo/dependencies/jquery/jquery-1.12.0.js"></script>
    <script type="text/javascript" src="examples/demo/dependencies/js/utils.js"></script>
    
    <!-- Bootstrap -->
    <script src="examples/demo/dependencies/bootstrap/js/bootstrap.js"></script>
We also recommend to set hidden attribute to local and remote audio divs
Code:
    <div id="remoteAudio" hidden=true></div>
    <div id="localAudio" hidden=true></div>
2. click-to-call-min.js file
You've set a wrong path to preloader. Instead of this
Code:
var PRELOADER_URL = "../../dependencies/media/preloader.mp4";
you should write like this
Code:
var PRELOADER_URL = "examples/demo/dependencies/media/preloader.mp4";
Then, you should refactor init_page() function as we recommended above
Code:
function init_page(){
 Flashphoner.init({});
 localAudio = document.getElementById("localAudio");
 remoteAudio = document.getElementById("remoteAudio");
 if (Browser.isSafariWebRTC() && Flashphoner.getMediaProviders()[0] === "WebRTC") {
    Flashphoner.playFirstVideo(localAudio, true, PRELOADER_URL).then(function () {
         Flashphoner.playFirstVideo(remoteAudio, false, PRELOADER_URL).then(function () {
               connect();
         });
    });
    return;
 } else {
    connect();
 }
}
Please note that local and remote audio divs should be the first argument of playFirstVideo function.
In this case, there are no errors in console, and the call is established successfully from iOS
1609296701782.png
 

Max

Administrator
Staff member
You can change callerID and sipLogin only on backend side. visibleName parameter changes the caller name displayed, and callee parameter changes phone number to call.
 

jobs

New Member
Top