We're building a web application using the Skype Web SDK (https://msdn.microsoft.com/en-us/skype/websdk/docs/skypewebsdk). We use both the audio and the IM capability to get connected to other parties.
Currently we're facing the following problem: If our application is in a conversation with another party (e. g. with a Skype for Business desktop client) and the user leaves or reloads the page, the other party doesn't get notified about the left user.
For audio conversations the result is the following: The other party is still in the call and the only indication of the leaving is that the other party can't hear anything.
For IM conversations the result is the following: If the other party sends an IM in this conversation it gets the notification that the message couldn't be delivered.
We've tried to leave the conversation before the unload of the page using the onbeforeunload event. The callback is executed both in IE 11 and Chrome, but only in Chrome the user actually leaves the conversation (tested with IM conversation since audio/video is not supported in Chrome).
window.onbeforeunload = function() {
// conversation is the conversation we're currently in
conversation.leave().then(function () {
client.conversationsManager.conversations.remove(conversation);
});
};
Since we rely on the audio capability we're not able to simply switch to Chrome only. Is there any way to ensure that the conversations are cleaned up on page reload/leave in Internet Explorer?
The problem with what you are trying to do is that the (on)beforeunload event does not wait around for asynchronous methods to complete so you are not guaranteed that leave() will execute nor the inner action to remove the conversation from the conversationsManager. I would suggest an approach similar to the following question - onbeforeunload confirmation screen customization or beforeunload
What you want to do is put the user into a state where the need to interact with a dialog which may (but also not guaranteed) give enough cycles to leave the conversation. In your case it might look something like the following:
window.onbeforeunload = function(e) {
// track if a conversation is live
if (_inActiveConversation) {
// conversation is the conversation we're currently in
conversation.leave().then(function () {
client.conversationsManager.conversations.remove(conversation);
});
var msg = 'Cleaning up active conversations...';
e.returnValue = msg;
return msg;
}
};
What you should also understand is that eventually the server side will remove that user from the conversation because the application is no longer processing incoming events. So the above is a best effort to clean up resources that will eventually be reclaimed.
You could also try to issuing a signOut request on the signInManager as that should allow the server to clean up resources related to that application on the server side.
window.onbeforeunload = function() {
...
_client.signInManager.signOut();
...
};
Related
hi
I want to build a control panel for a web art application that needs to run in fullscreen, so all this panel, that controls stuff like colors and speed values, have to be located at a different window.
My idea is to have a database storing all these values and when I make a change in the control panel window the corresponding variable in the application window gets updated too. So, it's basically a real-time update that I could do with AJAX setting a interval to keep checking for changes BUT my problem is: I can't wait 30 seconds or so for the update to happen and I guess a every-1-second AJAX request would be impossible.
Final question: is there a way to create a sort of a listener to changes in the database and fire the update event in the main application only immediately after I change some value in the control panel? Does Angular or another framework have this capability?
(Sorry for the long explanation, but I hope my question is clearer by offering the context [: )
A web socket powered application would have this benefit. This carries a bit more complexity on the back end, but has the benefit of making your application as close to real-time as can be reasonably expected.
The Mozilla Development Network has some good documentation on websockets.
On the front end, the WebSocket object should work for you on most modern browsers.
I'm not sure what your back end is written in, but Socket.IO for Node.js and Tornado for Python will make your applications web-socket capable
If one window is opening the other windows via JavaScript, you can keep the reference to the opened window and use otherWindow.postMessage to pass messages across
"Parent" window looks like
// set up to receive messages
window.addEventListener('message', function (e) {
if (e.origin !== 'http://my.url')
return; // ignore unknown source
console.log(e.message);
});
// set up to send messages
var otherWindow = window.open('/foo', '_blank');
otherWindow.postMessage('hello world', 'http://my.url');
"Child" windows look similar
// same setup to recieve
// ...
// set up to send
var otherWindow = window.opener;
// ... same as before
For the realtime I would recommend using a library like socket.io or using a database like firebase.
For the fullscreen I would recommend using a library like angular-screenfull
i use https://pushjs.io/, had exactly the same problem and this is a really simple solution for your problem. It is capable of sending and listening to events without any database interference.
tl;dr: what's the logic behind browsers (Chrome, FF, Safari) behaving as an app that's online after clicking offline and not simply... go offline?
CPP, FOP, STP
I have a small socket.io app that fetches from Twitter's API to make an image gallery.
I wanted to style the the divs that create a frame around the photos, but while the app is running found out that when selecting the elements in the dev tools, whenever a new image was added, Chrome emits a "purple
pulsing" (hereafter referred to as CPP) that kicked me out of the div I wanted to style and (rudely) put me at its parent div (the Gallery proper, if you will).
Voilà:
I started by shutting off my WiFi, which solved the problem with two drawbacks:
remembered the offline option in the network panel
needed a connection to read the socket.io docs :~)
Next I tried the offline option and found that, like the production version, CPP reëmerged, the image requests logging net::ERR_INTERNET_DISCONNECTED.
I realized that I could probably set the option reconnection: false in the socket.io bit but alas, this novella of question (which contains multitudes) still beckoned:
The Actual Question(s)
What chez Google (and Firefox (Orange Pulse), Safari (Transparent Pulse), et. al) is the logic to this behavior?
Why not Truly Sever the relevant tab's connection?
Better yet, why not let the poor developer both hold fast to their element and acknowledge visually that new elements are being thrown in?
The images are still fetched (!) which makes the Offline option seem even more misleading.
The docs from Google reference PWAs and those with service workers... does
Check the Offline checkbox to simulate a completely offline network experience.
apply only to them?
The Code that Kinda Could:
Here are the ~20 relevant lines at play (and here's the whole gig):
// app.js
var T = new Twit(config)
var stream = T.stream('statuses/filter', { track: '#MyHashtag', })
stream.on('tweet', function(tweet) { io.sockets.emit('tweet', tweet) })
function handler(request, response) {
var stream = fs.createReadStream(__dirname + '/index.html')
stream.pipe(response)
}
... and the index.html's relevant script:
// index.html
var socket = io.connect('/');
socket.on('tweet', function(tweet) {
if (someConditions = foo) {
tweet_container.innerHTML = '<img src="'
+ tweet.user.profile_image_url +
'" />'
}
}, 1000)
Nota Bene: I realize this question contains questions germane to polling, streams, networking, and topics whose names I'm not even familiar with, but my primary curiosity is what's the logic behind behaving as an app that's online after clicking offline and not simply... go offline" (and behave as it does when disconnecting from WiFi).
P.S.S here's a quote from knee-deep in the socket.io docs
If a certain client is not ready to receive messages (because of network slowness or other issues, or because they’re connected through long polling and is in the middle of a request-response cycle), if it doesn’t receive ALL the tweets related to bieber your application won’t suffer.
In that case, you might want to send those messages as volatile messages.
I am trying to record a call in chrome that is done with sipML5.
So basically the call handling is working fine and calls go through perfectly and both parties can hear each other perfectly.
The problem comes when I want to record the call.
So I just did the bare minimum to get a recording.
chunks = [];
navigator.mediaDevices.getUserMedia({audio:true})
.then(stream => {
rec = new MediaRecorder(stream);
rec.ondataavailable = e => {
chunks.push(e.data);
}
})
.catch(e=>console.log(e));
Then start a call with someone, it rings, they answer,
then I do rec.start(); in the console. Then after 5 seconds of conversation I end the call and do rec.stop(); in the console.
Then I do:
blob = new Blob(chunks,{type:'audio/ogg'});
$('.audio-remote', document).attr('src',URL.createObjectURL(blob))
to create the blob and provide the audio element with the src it needs.
That audio element then immediately starts playing back the audio and it is only the browser side of the conversation. Nothing is heard from the side of the cellphone. So only my voice through my mic is recorded.
Now I am not an expert on everything WebRTC, but it looks like getUserMedia provides you with a stream of only your devices and input and has nothing to do with the fact that your having a sip induced call with another party. Then obviously this is what sipML5 must do on the inside is take my input and send it through to the sip provider we use which translates it into the phone call. And the voice coming from the phone call is just presented to me through that audio element.
So I want to know if there is way to capture this conversation as is?
To capture both my input and the voice data from the sip client as one conversation.
Thanks in advance.
I have a very frustrating problem with a client's network environment, and I'm hoping someone can lend a hand in helping me figure this out...
They have an app that for now is written entirely inside of VBA for Excel. (No laughing.)
Part of my helping them improve their product and user experience involved converting their UI from VBA form elements to a single WebBrowser element that houses a rich web app which communicates between Excel and their servers. It does this primarily via a socket.io server/connection.
When the user logs in, a connection is made to a room on the socket server.
Initial "owner" called:
socket.on('create', function (roomName, userName) {
socket.username = userName;
socket.join(roomName);
});
Followup "participant" called:
socket.on('adduser', function (userName, roomName){
socket.username = userName;
socket.join(roomName);
servletparam = roomName;
var request = require('request');
request(bserURL + servletparam, function (error, response, body) {
io.sockets.to(roomName).emit('messages', body);
});
servletparam = roomName + '|' + userName;
request( baseURL + servletparam, function (error, response, body) {
io.sockets.to(roomName).emit('participantList', body);
});
});
This all worked beautifully well until we got to the point where their VBA code would lock everything up causing the socket connection to get lost. When the client surfaces form it's forced VBA induced pause (that lasts anywhere from 20 seconds to 3 minutes), I try to join the room again by passing an onclick to an HTML element that triggers a script to rejoin. Oddly, that doesn't work. However if I wait a few seconds and click the object by hand, it does rejoin the room. Yes, the click is getting received from the Excel file... we see the message to the socket server, but it doesn't allow that call to rejoin the room.
Here's what makes this really hard to debug. There's no ability to see a console in VBA's WebBrowser object, so I use weinre as a remote debugger, but a) it seems to not output logs and errors to the console unless I'm triggering them to happen in the console, and b) it loses its connection when socket.io does, and I'm dead in the water.
Now, for completeness, if I remove the .join() calls and the .to() calls, it all works like we'd expect it to minus all messages being written into a big non-private room. So it's an issue with rejoining rooms.
As a long-time user of StackOverflow, I know that a long question with very little code is frowned upon, but there is absolutely nothing special about this setup (which is likely part of the problem). It's just simple emits and broadcasts (from the client). I'm happy to fill anything in based on followup questions.
To anyone that might run across this in the future...
The answer is to manage your room reconnection on the server side of things. If your client can't make reliable connections, or is getting disconnected a lot, the trick it to keep track of the rooms on the server side and join them when they do a connect.
The other piece of this that was a stumper was that the chat server and the web UI weren't on the same domain, so I couldn't share cookies to know who was connecting. In their case there wasn't a need to have them hosted in two different places, so I merged them, had Express serve the UI, and then when the client surfaced after a forced disconnect, I'd look at their user ID cookie, match them to the rooms they were in that I kept track of on the server, and rejoined them.
I wish to send a request to a Website (server) to update a potential scoreboard which everyone who has the application can see. This website isn't of course restricted to just the application users - but it can be accessible to anyone.
Is it possible to call a WCF from a Windows Phone app for example where the WCF can then update the database. So whenever someone goes on the website, the updated changes will be seen.
Is this at all possible? And if it is, would this be the most sensible/optimised way of doing things?
I did this using a BsckgroundWorker in my ViewModel to prevent hanging the UI. This way, you can "set it and forget it". Something like this:
private void UpdateScoreboard()
{
var scoreboardWorker = new BackgroundWorker();
scoreboardWorker.DoWork += (s,dwe)=>{
//call some WCF service compleate async
};
scoreboardWorker.RunWorkerCompleted += (s,rwe)=>{
// check whether rwe.Error is not null, indicating an exception. Show an alert maybe
};
scoreboardWorker.RunWorkerAsync();
}