CODEWITHSUNDEEP
webrtcangular7agora.io
Bhakar
Bhakar

Reputation: 43

How Can Access Camara And Mic Globally in Agora.io

I am using Angular 7 with Angora.Io, My problem is when I run my Angular project locally then I successfully get access to my camera and microphone but when I try to run globally like "192.105.2.448" then I don't get access to my camera and microphone and an error like this is thrown. Please help me!

join(): void {

    this.client.setClientRole('host');
    this.localStream = this.agoraService.createStream({ streamID: this.uid, audio: true, video: true, screen: false });
    this.localStream.setVideoProfile('720p_3');
    this.assignLocalStreamHandlers();
    this.init();
    this.client.join(null , this.channel.value, this.uid);
}

publish(): void {

    this.liveplay = true;
    this.client.publish(this.localStream, err =>   console.log('Publish local stream error: ' + err));  }

protected init(): void {

    this.localStream.init(
        () => {
            // The user has granted access to the camera and mic.
            console.log('getUserMedia successfully' , this.localStream);
            this.localStream.play('agora_local');
            this.connected = true;
        },
        err => console.log('getUserMedia failed', err)
    );
}


private assignLocalStreamHandlers(): void {

    console.log('==========>>>>>>>2 ');
    this.localStream.on(StreamEvent.MediaAccessAllowed, () => {
        console.log('accessAllowed --->>> ', this.localStream);
    });
    // The user has denied access to the camera and mic.
        this.localStream.on(StreamEvent.MediaAccessDenied, () => {
        console.log('accessDenied');
    });
}

11:35:01:76 Agora-SDK [ERROR]: [3] Media access NOT_SUPPORTED: Only secure origins are allowed

[Deprecation] getUserMedia() no longer works on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS.

Upvotes: 2

Views: 1693

Answers (2)

Hermes
Hermes

Reputation: 2898

What you are experiencing is not an issue unique to Agora's SDK but is the expected behavior of any web browser. In order to access Camera and Microphone permissions all browsers require you to use a secure connection (read: HTTPS) and will block access to any websites that are not accessed with a secure connection.

Browsers do have one special feature which has white-listed localhost so that any projects being run locally using localhost will be allowed to access device permissions. This is why your project works "locally" but not "globally".

For you to be able to test your project "globally" then you will need to use a domain with an ssl certificate so that you see https in the url. While possible to use HTTPS with an IP address it is not common nor recommended (Is it possible to have SSL certificate for IP address, not domain name?)

One option (that I like to use) for testing is NGROK (https://ngrok.com), they offer a tunneling service that creates a "tunnel out" from your machine and provides an https url that enables you to test projects that are running on your local machine.

disclaimer: I am in no way affiliated with NGROK, this is a tool I that I find helpful and choose to use while testing my code, to work around the restrictions imposed by browsers without deploying my work to a remote server.

Upvotes: 2

ʌɐɥqıɐʌ
ʌɐɥqıɐʌ

Reputation: 147

I am not into Angular but since agora provide some api regarding custom Audio/Video sources. you can check https://docs.agora.io/en/Interactive%20Broadcast/custom_video_web?platform=Web

Upvotes: -1

Related Questions