diff --git a/openvidu-ionic-capacitor/android/app/src/main/AndroidManifest.xml b/openvidu-ionic-capacitor/android/app/src/main/AndroidManifest.xml index fa85f164..f96e304a 100644 --- a/openvidu-ionic-capacitor/android/app/src/main/AndroidManifest.xml +++ b/openvidu-ionic-capacitor/android/app/src/main/AndroidManifest.xml @@ -8,7 +8,8 @@ android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" - android:theme="@style/AppTheme"> + android:theme="@style/AppTheme" + android:usesCleartextTraffic="true"> cam.deviceId !== this.cameraSelected.deviceId); + const newCamera = this.cameras.find(cam => cam.deviceId !== this.cameraSelected.deviceId); if (!!newCamera) { this.isFrontCamera = !this.isFrontCamera; const pp: PublisherProperties = { @@ -179,7 +176,6 @@ export class AppComponent implements OnInit, OnDestroy { const videoTrack: MediaStreamTrack = newTrack.getVideoTracks()[0]; await (this.publisher as Publisher).replaceTrack(videoTrack); this.cameraSelected = newCamera; - } } catch (error) { console.error(error); @@ -197,79 +193,37 @@ export class AppComponent implements OnInit, OnDestroy { this.microphoneIcon = publish ? 'mic' : 'mic-off'; } - async presentSettingsAlert() { - const alert = await this.alertController.create({ - header: 'OpenVidu Server config', - inputs: [ - { - name: 'url', - type: 'text', - value: 'https://demos.openvidu.io', - placeholder: 'URL' - }, - { - name: 'secret', - type: 'text', - value: 'MY_SECRET', - placeholder: 'Secret' - } - ], - buttons: [ - { - text: 'Cancel', - role: 'cancel', - cssClass: 'secondary' - }, - { - text: 'Ok', - handler: (data) => { - this.OPENVIDU_SERVER_URL = data.url; - this.OPENVIDU_SERVER_SECRET = data.secret; - } - } - ] - }); - - await alert.present(); - } - private async initDevices() { this.devices = await this.OV.getDevices(); - this.cameras = this.devices.filter((d) => d.kind === 'videoinput'); - this.microphones = this.devices.filter((d) => d.kind === 'audioinput' && d.label !== 'Default'); + + this.cameras = this.devices.filter(d => d.kind === 'videoinput'); + this.microphones = this.devices.filter(d => d.kind === 'audioinput' && d.label !== 'Default'); this.cameraSelected = this.cameras[0]; this.microphoneSelected = this.microphones[0]; } - private checkAndroidPermissions(): Promise { - console.log('Requesting Android Permissions'); - return new Promise((resolve, reject) => { - this.androidPermissions - .requestPermissions(this.ANDROID_PERMISSIONS) - .then(() => { - const promisesArray: Promise[] = []; - this.ANDROID_PERMISSIONS.forEach((permission) => { - console.log('Checking ', permission); - promisesArray.push(this.androidPermissions.checkPermission(permission)); - }); - Promise.all(promisesArray) - .then((responses) => { - let allHasPermissions = true; - responses.forEach((response, i) => { - allHasPermissions = response.hasPermission; - if (!allHasPermissions) { - reject(new Error('Permissions denied: ' + this.ANDROID_PERMISSIONS[i])); - } - }); - resolve(); - }) - .catch((err) => { - console.log(err); - }); - }) - .catch((err) => console.error('Error requesting permissions: ', err)); - }); + private async checkAndroidPermissions(): Promise { + await this.platform.ready(); + try { + await this.androidPermissions.requestPermissions(this.ANDROID_PERMISSIONS); + const promisesArray: Promise[] = []; + this.ANDROID_PERMISSIONS.forEach((permission) => { + console.log('Checking ', permission); + promisesArray.push(this.androidPermissions.checkPermission(permission)); + }); + const responses = await Promise.all(promisesArray); + let allHasPermissions = true; + responses.forEach((response, i) => { + allHasPermissions = response.hasPermission; + if (!allHasPermissions) { + throw (new Error('Permissions denied: ' + this.ANDROID_PERMISSIONS[i])); + } + }); + } catch (error) { + console.error('Error requesting or checking permissions: ', error); + throw (error); + } } private generateParticipantInfo() { @@ -285,89 +239,77 @@ export class AppComponent implements OnInit, OnDestroy { } } - /* - * -------------------------- - * SERVER-SIDE RESPONSIBILITY - * -------------------------- - * This method retrieve the mandatory user token from OpenVidu Server, - * in this case making use Angular http API. - * This behaviour MUST BE IN YOUR SERVER-SIDE IN PRODUCTION. In this case: - * 1) Initialize a Session in OpenVidu Server (POST /openvidu/api/sessions) - * 2) Create a Connection in OpenVidu Server (POST /openvidu/api/sessions//connection) - * 3) The Connection.token must be consumed in Session.connect() method + async presentSettingsAlert() { + const alert = await this.alertController.create({ + header: 'OpenVidu deployment', + inputs: [ + { + name: 'url', + type: 'text', + value: 'https://demos.openvidu.io/', + placeholder: 'URL', + } + ], + buttons: [ + { + text: 'Cancel', + role: 'cancel', + cssClass: 'secondary', + }, + { + text: 'Ok', + handler: (data) => { + this.APPLICATION_SERVER_URL = data.url; + }, + }, + ], + }); + + await alert.present(); + } + + + /** + * -------------------------------------------- + * GETTING A TOKEN FROM YOUR APPLICATION SERVER + * -------------------------------------------- + * The methods below request the creation of a Session and a Token to + * your application server. This keeps your OpenVidu deployment secure. + * + * In this sample code, there is no user control at all. Anybody could + * access your application server endpoints! In a real production + * environment, your application server must identify the user to allow + * access to the endpoints. + * + * Visit https://docs.openvidu.io/en/stable/application-server to learn + * more about the integration of OpenVidu in your application server. */ - - private getToken(): Promise { - if (this.platform.is('ios') && this.platform.is('capacitor') && this.OPENVIDU_SERVER_URL === 'https://localhost:4443') { - // To make easier first steps with iOS apps, use demos OpenVidu Sever if no custom valid server is configured - this.OPENVIDU_SERVER_URL = 'https://demos.openvidu.io'; + async getToken(): Promise { + if ( + this.platform.is('ios') && + this.platform.is('cordova') && + this.APPLICATION_SERVER_URL === 'http://localhost:5000/' + ) { + // To make easier first steps with iOS apps, use demos OpenVidu deployment when no custom deployment is configured + this.APPLICATION_SERVER_URL = 'https://demos.openvidu.io/'; } - return this.createSession(this.mySessionId).then((sessionId) => this.createToken(sessionId)); + const sessionId = await this.createSession(this.mySessionId); + return await this.createToken(sessionId); } - private createSession(sessionId) { - return new Promise((resolve, reject) => { - const body = JSON.stringify({ customSessionId: sessionId }); - const options = { - headers: new HttpHeaders({ - Authorization: 'Basic ' + btoa('OPENVIDUAPP:' + this.OPENVIDU_SERVER_SECRET), - 'Content-Type': 'application/json' - }) - }; - return this.httpClient - .post(this.OPENVIDU_SERVER_URL + '/openvidu/api/sessions', body, options) - .pipe( - catchError((error) => { - if (error.status === 409) { - resolve(sessionId); - } else { - console.warn( - 'No connection to OpenVidu Server. This may be a certificate error at ' + this.OPENVIDU_SERVER_URL - ); - if ( - window.confirm( - 'No connection to OpenVidu Server. This may be a certificate error at "' + - this.OPENVIDU_SERVER_URL + - '"\n\nClick OK to navigate and accept it. If no certificate warning is shown, then check that your OpenVidu Server' + - 'is up and running at "' + - this.OPENVIDU_SERVER_URL + - '"' - ) - ) { - location.assign(this.OPENVIDU_SERVER_URL + '/accept-certificate'); - } - } - return observableThrowError(error); - }) - ) - .subscribe((response: any) => { - console.log(response); - resolve(response.id); - }); - }); + createSession(sessionId) { + return this.httpClient.post( + this.APPLICATION_SERVER_URL + 'api/sessions', + { customSessionId: sessionId }, + { headers: { 'Content-Type': 'application/json' }, responseType: 'text' } + ).toPromise(); } - private createToken(sessionId): Promise { - return new Promise((resolve, reject) => { - const body = JSON.stringify({}); - const options = { - headers: new HttpHeaders({ - Authorization: 'Basic ' + btoa('OPENVIDUAPP:' + this.OPENVIDU_SERVER_SECRET), - 'Content-Type': 'application/json' - }) - }; - return this.httpClient - .post(this.OPENVIDU_SERVER_URL + '/openvidu/api/sessions/' + sessionId + '/connection', body, options) - .pipe( - catchError((error) => { - reject(error); - return observableThrowError(error); - }) - ) - .subscribe((response: any) => { - console.log(response); - resolve(response.token); - }); - }); + createToken(sessionId) { + return this.httpClient.post( + this.APPLICATION_SERVER_URL + 'api/sessions/' + sessionId + '/connections', + { customSessionId: sessionId }, + { headers: { 'Content-Type': 'application/json' }, responseType: 'text' } + ).toPromise(); } }