licode icon indicating copy to clipboard operation
licode copied to clipboard

Support Apple Safari

Open mccob opened this issue 7 years ago • 69 comments

Apple Safari/Webkit support is here since Safari 11.

Apple use Google/WebRTC libwebrtc.

See : https://webkit.org/blog/7726/announcing-webrtc-and-media-capture/ https://webkit.org/blog/7627/safari-technology-preview-32/

Available at least on Mac OS.

Safari tech preview is available for actual Mac OS Sierra.

Licode isn't working.

Seems a specific stack is needed.

First error solved, has to use window.RTCPeerConnection

WebkitRTCPeerConnection = window.RTCPeerConnection,

Other errors that must be solved :

  • [Error] Unhandled Promise Rejection: TypeError: Type error createObjectURL
  • [Error] TypeError: Error creating RTCPeerConnection initializeRTCPeerConnection
  • [Error] TypeError: undefined is not an object (evaluating 'stream.pc.processSignalingMessage') (anonymous function)

if you want to help :)

mccob avatar Jun 08 '17 16:06 mccob

I'll probably look into it next week! have a nice day!

kekkokk avatar Jun 09 '17 07:06 kekkokk

Finally!! It's a good time for migrating to adapter.js and get rid of all these browser stacks.

mkhahani avatar Jun 09 '17 08:06 mkhahani

We might discuss that, is not that straight forward. we have always to differentiate by chrome and firefox for little things (ex. opus nack, the "a=" in front of ices, the filtering out of the end candidate in chrome etc.) so maybe we'll always have the various stacks. but with a refactor of the sdp parser in C++ we might have good results with adapter.

kekkokk avatar Jun 09 '17 08:06 kekkokk

I've been trying this week. I was able to create a videoconference with publishers sending video/audio from Chrome, Firefox and Safari, after solving all the errors mentioned by @mccob. Things to consider when we implement it:

  • Safari only supports h.264.
  • h.264 support in Licode is not perfect, we might need to add better support for fmtp lines in the SDP. I found some issue when sending H.264 from Firefox because of that, but I solved it with a quick and dirty hack.
  • I was able to send video from Safari, and I received and rendered it in Chrome and Firefox.
  • I didn't receive any data in Safari from publishers in Chrome and Firefox. The API is slightly different and I don't know if things like OfferToReceiveVideo or Transceivers are completely implemented in Safari's current implementation (WebRTC in Safari is still a WIP, but really close to be completed I think, and they're probably thinking of adding native support for WebRTC in iOS 11, I think I saw something about it in their last keynote).

Completely agree with @kekkokk, with might need to discuss adapterjs and/or other solutions. Anyway, thanks @mccob for playing with Safari. Can you try enabling h264 in the rtp_media_config?

jcague avatar Jun 09 '17 10:06 jcague

FYI: https://github.com/lynckia/licode/compare/master...jcague:poc/safari this is the result of a couple of hours trying to make it work... I'm not proud of it, it's plenty of hacks!! so please don't use it in production, staging or even debugging :joy:

jcague avatar Jun 09 '17 10:06 jcague

@jcague any plan to try edge? I opened the most detailed post i could @ DISCOURSE but I had no response :( in business environments is way more used than safari. Another question I never asked: is licode h264 ready? I implemented licode also in iOS and Android but especially in the last one I can feel vp8 more "stressful" than h264. Do you think I could switch seamlessly into h264 without problems? or something (ex. externaloutput) will break? I never tried....

kekkokk avatar Jun 09 '17 12:06 kekkokk

@jcague

h.264 support in Licode is not perfect

Are you talking about P2P oder the MCU mode?

Asking because we need h264 support on the MCU, because of

I implemented licode also in iOS and Android but especially in the last one I can feel vp8 more "stressful" than h264.

We use https://github.com/BasqueVoIPMafia/cordova-plugin-iosrtc for iOS right now* and observed performance problems, we'd love to try h264 since this might be a hardware support related issue.

*We use adapter.js and actually the chrome stack for iOS, works fine for a long time now (but we don't use the latest features like SimulCast, but Opus, Isac etc works fine!)

menelike avatar Jun 14 '17 16:06 menelike

Is there any ETA on when Licode starts supporting Safari? Even if it's not perfect but good-enough for some limited use cases.

thehappycoder avatar Sep 08 '17 01:09 thehappycoder

Calls

I found the reason why safari doesn't receive media from other browsers.

I didn't receive any data in Safari from publishers in Chrome and Firefox.

MCU doesn't send answer sdp until it receives ICE candidates. But safari doesn't generate and send ICE candidates. https://bugs.webkit.org/show_bug.cgi?id=176157 One way to fix this is a shim in adapter.js (https://github.com/webrtc/adapter/issues/661)

After locally changing adapter js, I could make it work. Now safari receives audio and video from other browsers.

Recording

For call recording to work, ExternalOutput probably needs to be changed to follow the h264 specs. Is there any ETA for this?

miniruwan avatar Sep 18 '17 04:09 miniruwan

After locally changing adapter js, I could make it work. Now safari receives audio and video from other browsers.

@miniruwan Could you get it to work with Licode? I built EC with the latest adapter.js (v6.3.2) but still could not receive audio/video in Safari.

mkhahani avatar Aug 18 '18 04:08 mkhahani

try with this SafariStack

/* global */

import Logger from '../utils/Logger';
import BaseStack from './BaseStack';

const SafariStack = (specInput) => {
  Logger.info('Starting Safari stack');
  const spec = specInput;

  const newIces = [];

  spec.iceServers.forEach((server) => {
    const newServer = {};
    if (server.url) {
      newServer.urls = server.url;
    }
    if (server.username) {
      newServer.username = server.username;
    }
    if (server.credential) {
      newServer.credential = server.credential;
    }
    newIces.push(newServer);
  });

  spec.iceServers = newIces;

  const that = BaseStack(spec);

  return that;
};

export default SafariStack;

kekkokk avatar Aug 27 '18 07:08 kekkokk

Thanks for the response but it didn't help :(

Hopefully in p2p mode, Chrome2Safari and Safari2Chrome work well on both MacOS and iOS. I believe it can be fixed to work also in MCU mode.

Even I think Chrome over iOS must be able to receive audio/video after Safari added support for WebRTC since Chrome uses WKWebView component for iOS and it supports RTCPeerConnection now.

mkhahani avatar Aug 28 '18 13:08 mkhahani

added support for WebRTC

Just my two cents...

Well yes, they "support" webRTC but still, VP8 is not supported just to name one of the many drawbacks. Without going into the details on how flawed webRTC on iOS is, as long as you have to rely on mobile browsers between iOS and Android, results are unpredictable. Your best chance will be to stick to h264, but then licode doesn't support h264 within the MCU.

IMHO for a complete working support for all devices including desktop browsers, iOS and Android clients need to be implemented natively. In addition/or instead a transcoding MCU is advised.

menelike avatar Aug 28 '18 16:08 menelike

actually Licode does support for h264. and works well with safari. I actually made lots of changes to be able to, mainly you can see my EDGE stack PR and add the stack I posted few comments above

kekkokk avatar Aug 28 '18 18:08 kekkokk

@menelike Thanks for your advice. I'm just trying to find a way to add support for iOS in my app and it's become a nightmare.

We use https://github.com/BasqueVoIPMafia/cordova-plugin-iosrtc for iOS right now

Actually I was going to write my own hybrid app using cordova+iosrtc plugin, as discussed here, but I figure it out that the provided iOSStack is out of sync with the latest licode changes. Do you have any update on that?

mkhahani avatar Aug 28 '18 18:08 mkhahani

@kekkokk Are you saying you could get the mcu to work with Safari+iOS? Then where can I find your PR?

mkhahani avatar Aug 28 '18 18:08 mkhahani

@mkhahani We have to use https://github.com/BasqueVoIPMafia/cordova-plugin-iosrtc as well, and it's a pain. The project is almost dead, one major problem will be, that h264 playback will result in a green screen (h264 is the first choice on iOS because it should reduce the CPU load)

I think all work regarding webRTC has shifted from Cordova to react native (https://github.com/oney/react-native-webrtc), imho Cordova and webRTC will never work, especially not since getUserMedia is not available in WKWebView.

We also switched from licode to https://github.com/meetecho/janus-gateway, but this won't help you in your situation.

menelike avatar Aug 29 '18 06:08 menelike

@mkhahani We actually have one dev only for iOS and we did a native app with the webrtc core. the webrtc core supports vp8 on iphone.

kekkokk avatar Aug 30 '18 07:08 kekkokk

@menelike

imho Cordova and webRTC will never work

But it was working in my tests before the latest changes in Erizo Client.

We also switched from licode to https://github.com/meetecho/janus-gateway

Do you really found Janus better than Licode?!

mkhahani avatar Aug 30 '18 15:08 mkhahani

@kekkokk

We actually have one dev only for iOS and we did a native app with the webrtc core.

Wow that's a lot of work! What do you mean by the "webrtc core" exactly? Are you using the one provided by webrtc.org? And is that compatible with Licode?

mkhahani avatar Aug 30 '18 15:08 mkhahani

yeah sure! that's a ton of works but, actually, is the one used by chrome. so the sdps are quite similar and supports vp8.

kekkokk avatar Aug 30 '18 16:08 kekkokk

@kekkokk @menelike What do you think about Temasys WebRTC Plugin which is used by Jitsi to add support for WebRTC in IE and Safari?

mkhahani avatar Aug 31 '18 05:08 mkhahani

we are using this only for IE and works quite well (produces sdp very similar to chrome). For the safari side, we found very difficult, now that safari 11 supports natively webrtc, to interoperate with the plugin. It was too difficult to differentiate safari versions and choose to use the plugin or not. ATM we enabled only safari >= 11 in our platform so the call will init in h264 room

ps. doesn't support simulcast ofc

kekkokk avatar Aug 31 '18 10:08 kekkokk

@mkhahani There is an IOS ObjC client for Licode I've done a while ago, not sure how it works with latest version of Licode since I didn't had chance to work on it lately but I am sure if it doesn't work out-of-the-box it just need some signaling-protocol update almost. PR and maintainers are welcome, Link bellow in case you want to check it out.

https://github.com/zevarito/Licode-ErizoClientIOS

zevarito avatar Aug 31 '18 13:08 zevarito

Thank you @zevarito, I am aware of your iOS app but I'm trying to avoid writing native since I've done a lot of work on other parts of my app like ui, signaling, etc.

mkhahani avatar Aug 31 '18 13:08 mkhahani

@mkhahani Did you find that Chrome to Safari, iOS to macOS combinations work in p2p mode?

jaydgoss avatar Sep 03 '18 06:09 jaydgoss

Using h264, Windows.Chrome <=> macOS.Safari worked fine in both directions. There was a problem with rendering video on iOS but I didn't spend time to fix it.

mkhahani avatar Sep 03 '18 07:09 mkhahani

@mkhahani I just created an ios client with react-native and react-native-webrtc. I suggest use that, the only changes it needs is to change BaseStack to use react-native-webrtc, just with importing them:

import {
  RTCPeerConnection,
  RTCIceCandidate,
  RTCSessionDescription
} from 'react-native-webrtc';

Also you need to change FcStack to use BaseStack. Ask me if you had any problems.

But I have also an issue regarding Safari on mac, it starts but it can't hear and see the other participants (other participants on windows chrome) also the others can't see the safari, I think it's because of the following error in baseStack at processAnswer:

OperationError: Failed to set remote answer sdp: Session error code: ERROR_CONTENT. Session error description: Failed to set remote video description send parameters

can anyone help me around this?

pooyarm avatar Sep 05 '18 08:09 pooyarm

@pooyarm Thanks for your suggestion. Then I have to migrate to React which is a lot of work due to the amount of codes in my app.

mkhahani avatar Sep 11 '18 03:09 mkhahani

There was a problem with rendering video on iOS but I didn't spend time to fix it.

It seems adding playsinline attribute to the video tag fixes the issue on iOS. Here is a great artice, Guide to WebRTC with Safari.

mkhahani avatar Sep 13 '18 05:09 mkhahani