Adding a special error message for non Safari browsers on iOS < 14.3

This commit is contained in:
David Négrier 2021-06-04 16:19:41 +02:00
parent 469cac9656
commit 9f09dc9df2
3 changed files with 30 additions and 1 deletions

View File

@ -0,0 +1,8 @@
export class WebviewOnOldIOS extends Error {
static NAME = 'WebviewOnOldIOS';
constructor() {
super('Your iOS version cannot use video/audio in the browser unless you are using Safari. Please switch to Safari or upgrade iOS to 14.3 or above.');
this.name = WebviewOnOldIOS.NAME;
}
}

View File

@ -6,6 +6,8 @@ import {userMovingStore} from "./GameStore";
import {HtmlUtils} from "../WebRtc/HtmlUtils"; import {HtmlUtils} from "../WebRtc/HtmlUtils";
import {BrowserTooOldError} from "./Errors/BrowserTooOldError"; import {BrowserTooOldError} from "./Errors/BrowserTooOldError";
import {errorStore} from "./ErrorStore"; import {errorStore} from "./ErrorStore";
import {isIOS} from "../WebRtc/DeviceUtils";
import {WebviewOnOldIOS} from "./Errors/WebviewOnOldIOS";
/** /**
* A store that contains the camera state requested by the user (on or off). * A store that contains the camera state requested by the user (on or off).
@ -421,6 +423,13 @@ export const localStreamStore = derived<Readable<MediaStreamConstraints>, LocalS
constraints constraints
}); });
return; return;
} else if (isIOS()) {
set({
type: 'error',
error: new WebviewOnOldIOS(),
constraints
});
return;
} else { } else {
set({ set({
type: 'error', type: 'error',
@ -598,7 +607,7 @@ microphoneListStore.subscribe((devices) => {
localStreamStore.subscribe(streamResult => { localStreamStore.subscribe(streamResult => {
if (streamResult.type === 'error') { if (streamResult.type === 'error') {
if (streamResult.error.name === BrowserTooOldError.NAME) { if (streamResult.error.name === BrowserTooOldError.NAME || streamResult.error.name === WebviewOnOldIOS.NAME) {
errorStore.addErrorMessage(streamResult.error); errorStore.addErrorMessage(streamResult.error);
} }
} }

View File

@ -0,0 +1,12 @@
export function isIOS(): boolean {
return [
'iPad Simulator',
'iPhone Simulator',
'iPod Simulator',
'iPad',
'iPhone',
'iPod'
].includes(navigator.platform)
// iPad on iOS 13 detection
|| (navigator.userAgent.includes("Mac") && "ontouchend" in document)
}