RTCIceCandidate instance cannot be created in browsers on moblie devices - javascript

I'm recently trying some awesome features of HTML5 and WebRTC, and am building a site to allow multiple people video chat.
Everything works just fine on my PC and the Media Capture of HTML5 works like a charm. But when I set up a video source on my PC, and try to connect to it via my android/iphone/ipad, it just did not work. I checked the logs, it suggests that the creation of RTCIceCandidate failed for some unknown reason:
// To be processed as either Client or Server
case "CANDIDATE":
trace("************important*********", "we get in");
var candidate = new RTCIceCandidate({candidate: msg.candidate});
trace("************important*********", JSON.stringify(candidate));
break;
turns out the second log never shows up.
Anyone has any idea? Is is because such features are not available on mobile devices for now? Or should I do something specially for mobile devices?
oh and this is the callback of IceCandidatem which is never called:
// This function sends candidates to the remote peer, via the node server
var onIceCandidate = function(event) {
if (event.candidate) {
trace("openChannel","Sending ICE candidate to remote peer : " + event.candidate.candidate);
var msgCANDIDATE = {};
msgCANDIDATE.msg_type = 'CANDIDATE';
msgCANDIDATE.candidate = event.candidate.candidate;
msgCANDIDATE.peer = server;
msgCANDIDATE.me = weAreActingAs;
//trace("openChannel","candidate peer : " + JSON.stringify(event));
socket.send(JSON.stringify(msgCANDIDATE));
} else {
trace("onIceCandidate","End of candidates");
}
}
The server is in nodejs.
Thanks so much guys! Need your hands!

You should be able to test device support here: http://www.simpl.info/getusermedia/
I'm no expert on webrtc but according to the following site there should be supported for IOS and Android: http://updates.html5rocks.com/2012/12/WebRTC-hits-Firefox-Android-and-iOS but you'll need to use the ericsson browser
In one of the comments it does say that ericsson browser uses the depreciated ROAP signaling and can't be used in peer communication with (for example) Chrome. One comment states that blackbarry native browser now supports getUserMedia so maybe Android and iOS will follow. No native support at the moment though. And ericsson browser implementation seems to be based on depreciated standards.

Related

Forget already paired device - web-bluetooth

I am working on web-bluetooth to connect a Web-App with BLE device. I have the connections now, I am looking how can I unpair a device.
I have looked into the official web-bluetooth documents
https://webbluetoothcg.github.io/web-bluetooth/#dom-bluetooth-getdevices haven't find much about it.
Can anybody suggest something on this?
Thanks
What a coincidence! I am currently working on adding a new forget() method on BluetoothDevice so that web developers can revoke permission access to a paired BluetoothDevice.
// Request a Bluetooth device.
const device = await navigator.bluetooth.requestDevice({ acceptAllDevices: true });
// Then later... revoke permission to the Bluetooth device.
await device.forget();
Spec PR: https://github.com/WebBluetoothCG/web-bluetooth/pull/574
Chromium CL: https://bugs.chromium.org/p/chromium/issues/detail?id=1302328
Note that this experimental functionality is currently available in Chrome 101 and requires users to enable the chrome://flags/#enable-web-bluetooth-new-permissions-backend flag.
You can try my sample at https://bluetoothdevice-forget.glitch.me/

WebRTC: use of getStats()

I'm trying to get stats of a webRTC app to measure audio/video streaming bandwidth.
I checked this question and I found it very useful; however, when I try to use it I get
TypeError: Not enough arguments to RTCPeerConnection.getStats.
I think that is because of in 2016 something in webRTC is changed and now there are mediaStreamTracks; however I built the project without mediaStreamTracks and I don't know how to change this function to get it to work.
Do you have any ideas?
Thanks for your support!
UPDATE:
My call is
peer.pc.onaddstream = function(event) {
peer.remoteVideoEl.setAttribute("id", event.stream.id);
attachMediaStream(peer.remoteVideoEl, event.stream);
remoteVideosContainer.appendChild(peer.remoteVideoEl);
getStats(peer.pc);
};
and getStats() is identical to this link at chapter n.7.
been sometime since I used WebRTC, problem then was, chrome and firefox implemented it differently( believe they still do it differently)
Firefox:
webrtc stats tab is about:webrtc
peerConnection.getStats(null).then(function(stats){... // returns a promise
Chrome:
webrtc stats tab is chrome://webrtc-internals/
peerConnection.getStats(function(stats){ // pass a callback function
one way to circumvent these cross browser issues is using adapter.js

How to pair a new Bluetooth device from a Chrome App on ChromeOS?

I'm writing a Chrome App using the chrome.bluetooth Javascript API and PNACL. I can turn on Bluetooth discovery, find devices, connect, and communicate successfully. But I cannot figure out how to pair a new device programmatically from my app.
There are Windows and Mac system APIs for this; is there an equivalent on ChromeOS?
Use the chrome.bluetooth API to connect to a Bluetooth device which works only on OS X, Windows and Chrome OS. All functions report failures via chrome.runtime.lastError.
You may make your chrome app connect to any device that supports RFCOMM or L2CAP services and that includes the majority of classic Bluetooth devices on the market.
As detailed in Chrome - Bluetooth, there are three things you need to make a connection to a device:
A socket to make the connection with, created using bluetoothSocket.create
the address of the device you wish to connect to
the UUID of the service itself.
Sample code implementation:
var uuid = '1105';
var onConnectedCallback = function() {
if (chrome.runtime.lastError) {
console.log("Connection failed: " + chrome.runtime.lastError.message);
} else {
// Profile implementation here.
}
};
chrome.bluetoothSocket.create(function(createInfo) {
chrome.bluetoothSocket.connect(createInfo.socketId,
device.address, uuid, onConnectedCallback);
});
Please note too that before making the connection, you should verify that the adapter is aware of the device by using bluetooth.getDevice or the device discovery APIs.
More information and sample code implementations can be found in the documentation.

Using Notification API for Electron App

How to implement Notification API on Electron App?
I tried checking Notification.permission and it returns granted
But when I try to run:
new Notification("FOO", {body:"FOOOOOOOOOOOOOOOOOOOOOOOOO"});
nothing happens. Is it even supported?
A good approach is use node-notifier for notifications, because the package have cross-platform notification support
Note: Since this is an HTML5 API it is only available in the renderer process.
Example :
let myNotification = new Notification('Title', {
body: 'Lorem Ipsum Dolor Sit Amet'
})
myNotification.onclick = () => {
console.log('Notification clicked')
}
Windows
On Windows 10, notifications "just work".
On Windows 8.1 and Windows 8, a shortcut to your app, with a Application User Model ID, must be installed to the Start screen. Note, however, that it does not need to be pinned to the Start screen.
On Windows 7, notifications are not supported. You can however send "balloon notifications" using the Tray API.
Furthermore, the maximum length for the notification body is 250 characters, with the Windows team recommending that notifications should be kept to 200 characters.
More information : https://github.com/electron/electron/blob/master/docs/tutorial/desktop-environment-integration.md#notifications-windows-linux-os-x
The HTML5 Notification API is only available in the renderer process.
You must require the Electron Notification API if you want to use notifications from the main process. The API is different from the standard/HTML5 version.
const {Notification} = require('electron');
new Notification({
title: 'Headline',
body: 'Here write your message'
}).show();
The notification API doesn't work on Windows, because there is no notification API that works on all versions of Windows (really Win10 is the first version where desktops have a documented API for it, Win8.x had it but it was WinRT-only)
Posting an updated answer that Electron has a section in their tutorial for their Notifications and about how to handle Windows
Windows
On Windows 10, a shortcut to your app with an Application User Model ID must be installed to the Start Menu. This can be overkill during development, so adding node_modules\electron\dist\electron.exe to your Start Menu also does the trick. Navigate to the file in Explorer, right-click and 'Pin to Start Menu'. You will then need to add the line app.setAppUserModelId(process.execPath) to your main process to see notifications.
On Windows 8.1 and Windows 8, a shortcut to your app with an Application User Model ID must be installed to the Start screen. Note, however, that it does not need to be pinned to the Start screen.
On Windows 7, notifications work via a custom implementation which visually resembles the native one on newer systems.
Electron attempts to automate the work around the Application User Model ID. When Electron is used together with the installation and update framework Squirrel, shortcuts will automatically be set correctly. Furthermore, Electron will detect that Squirrel was used and will automatically call app.setAppUserModelId() with the correct value. During development, you may have to call app.setAppUserModelId() yourself.
Furthermore, in Windows 8, the maximum length for the notification body is 250 characters, with the Windows team recommending that notifications should be kept to 200 characters. That said, that limitation has been removed in Windows 10, with the Windows team asking developers to be reasonable. Attempting to send gigantic amounts of text to the API (thousands of characters) might result in instability.
for window 7, you might try this: https://github.com/blainesch/electron-notifications - it generates 'desktop' notifications as separate electron windows. It looks pretty slick; I'm about to implement it now. I believe you'll need to use something like https://github.com/electron/electron/blob/master/docs/api/ipc-main.md to communicate between your app and the main electron process which would be responsible for displaying and managing the notifications, unless your main electron process is already responsible for the notification logic.
use
const notification = new window.Notification(
'LO SIENTO OCURRIO EL ERROR:',
{
body: error,
}
);
notification.onclick = () => console.log('Clicked');
notification.onclose = () => console.log('Closed');

Why is getUserMedia throwing a [object NavigatorUserMediaError] when I click "Allow" in Chrome?

Recently, I started getting errors when trying to access the client's mic through my website. When Chrome asks whether to allow the site to access the user's microphone, [object NavigatorUserMediaError] is produced whether they click "allow" or "deny." This has been happening regardless of whether or not a microphone is actually plugged into the computer (which is running Ubuntu 12.04).
Further testing through Firefox showed that this is not specific to Chrome. The problem only started after I had done a live-input demo and then logged out of the computer. I tried making a bare bones demo of accessing the microphone, and it ran into the same problem.
var getVideo = false, getAudio = true;
navigator.getUserMedia || (navigator.getUserMedia = navigator.mozGetUserMedia ||
navigator.webkitGetUserMedia || navigator.msGetUserMedia);
function init() {
if(navigator.getUserMedia) {
navigator.getUserMedia({video:getVideo, audio:getAudio}, onSuccess, onError);
} else {
alert('getUserMedia failed.');
}
}
function onSuccess() {
console.log("Yay");
}
function onError(err) {
console.log("Noo " + err);
}
This is rather puzzling as it had worked perfectly up until the point where I logged out and then logged back in and tried to test it again.
I am hosting the web code locally, through Jetty and Eclipse. I am accessing it by typing localhost:8080/my-program into the web browser.
Edit:
After the error occurs, the icon of a camera shows up in the chrome address bar, saying that Chrome is accessing my microphone and listing two possible microphones, "Default" and "Built-in Audio Analog Stereo."
Edit 2:
This error is also occurring on other websites that try to access my microphone through webrtc. Traditional Flash implementation still works.
Chrome seems to be throwing out an error message at regular intervals while open.
[361:362:0725/095320:ERROR:audio_output_device.cc(186)]
Not implemented reached in virtual void
media::AudioOutputDevice::OnStateChanged(media::AudioOutputIPCDelegate::State)
Edit 3:
I was able to clarify the error message a bit more
NavigatorUserMediaError {code: 1, PERMISSION_DENIED: 1}
** One Browser at a Time **
I've encountered this situation when I am testing with multiple browsers open. It would appear that only one browser can access the media at a time.
ie When I've got my page open in Chrome, and the video/audio is working, then Firefox won't work, and when I've got it working in Firefox, then Chrome doesn't work.
This can happen in two situations and I've experienced both in Ubuntu 12.04:
You have clicked Deny once and then the browser saves that setting, always returning error when asked for media access in that page. (This does not seem to be your case as you get the question from browser, but you just have to go to the address bar, click in the camera icon and change the option to ask again).
Your browser is not having access to the media devices and as in any computer without cameras nor microphones, even if you press Allow, you will get an error event as it cannot give you any streams. Try to check the browser settings to see if you can choose the selected camera. I've experienced this and the list was empty. To solve this I had to reboot the machine and Chrome started showing the list of devices again.
NavigatorUserMediaError {code: 1, PERMISSION_DENIED: 1}
This means your browser settings are not allowing you to access the camera. Go into your browser settings -> under website settings you'll find a list of webpages that you have blocked from accessing your device.
getUserMedia only works on https; no exception for localhost (i.e http://localhost). Safari also does not ever seem to allow getUserMedia from within an iFrame. I always get a “Trying to call getUserMedia from a document with a different security origin than its top-level frame” error. This makes using sites like codepen and jsfiddle impossible.
More detials https://webrtchacks.com/safari-webrtc/

Categories