Reception of a webcam on an iPhone 8 iOS 14.6 is sometimes 90° or 180°, suddenly the character is all turned upside down

[Madriix]

The reception of a webcam on an iPhone 8 iOS 14.6 is sometimes 90 ° or 160 °, suddenly the character is all turned upside down.

How should this be resolved?

Both are affected: https://github.com/meething/meething and https://github.com/meething/meething-mediasoup

Is there a parameter to adjust?

[Dletta]

Hi Maddrix, The browser handles the camera input. And Iphones particularly do their own thing for camera orientation, it’s usually based on the internal motion sensors not something the browser can force. If you are in options and click you video selector, what options do you have?

…

On Mon, May 31, 2021 at 23:36 Madriix ***@***.***> wrote: The reception of a webcam on an iPhone 8 iOS 14.6 is sometimes 90 ° or 160 °, suddenly the character is all turned upside down. How should this be resolved? Both are affected: https://github.com/meething/meething and https://github.com/meething/meething-mediasoup Is there a parameter to adjust? — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#265>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABLWWEU2434S4TSFZBBBMT3TQRPV7ANCNFSM4533BBYQ> .

[Madriix]

I do not know the parameters of the camera on iPhone, the iPhone is brand new I got it last week, it is mainly used for debugging. All options are default as for the majority of all people.
For sending from the camera it is in the right direction, but for the recipient (remote) it is in the wrong direction. This does not happen on other appli (ex https://github.com/dmotz/trystero), the camera is normal on iPhone for example for the recipient

[Madriix]

I have just retested the demo on https://us.meething.space/ on both my iPhone and my PC, by checking "P2P Mesh Only" the camera receiving bug does not occur wrong way. Why does this happen by unchecking it? It's strange.

To sum up:

• With the option checked "P2P Mesh Only", the reception of the camera from an iPhone user is correct
• With the option "P2P Mesh Only" disabled the reception of the camera from an iphone user is not correct, it is often at 90 ° or 180 °

[Dletta]

Can you choose the other camera from the video settings? The browser requests ‘front facing camera’ but it’s up to phone to provide it

…

On Tue, Jun 1, 2021 at 10:50 Madriix ***@***.***> wrote: I have just retested the demo on https://us.meething.space/ on both my iPhone and my PC, by checking "P2P Mesh Only" the camera receiving bug does not occur wrong way. Why does this happen by unchecking it? It's strange. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#265 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABLWWEUZGPVD76IRB35OBATTQT6T3ANCNFSM4533BBYQ> .

[Madriix]

@Dletta
The camera in front of her does the same, at 90 °
The day before yesterday a woman tested with her iPad, the camera was completely 180 °, head down, and the chair at the top of the screen

And I did another test by checking "P2P Mesh Only", and the format is correct, there is only in P2P that the direction of the camera is correct for the front camera and rear camera

[Madriix]

The problem also exists on https://v3demo.mediasoup.org/?roomId=[Name]
It's a shame it's a disadvantage

[Madriix]

I opened a ticket on versatica/mediasoup#577

[Madriix]

I modified this code in https://github.com/meething/meething-mediasoup/blob/master/client/lib/room.js :

async function onPeerOpen() {
  const device = new Device();
  const routerRtpCapabilities = await this.peer
  .request("getRouterRtpCapabilities")
  .catch(console.error);
  
  routerRtpCapabilities.headerExtensions = routerRtpCapabilities.headerExtensions.
  filter((ext) => ext.uri !== 'urn:3gpp:video-orientation');
  
  await device.load({ routerRtpCapabilities });
  await this._prepareSendTransport(device).catch(console.error);
  await this._prepareRecvTransport(device).catch(console.error);

  const res = await this.peer.request("join", {
    rtpCapabilities: device.rtpCapabilities
  });
  
  this.emit("@open", res);
}

It seems to be working fine now