Failed to Capture Photo in production (minified - ng build)

[hpardess]

angular v10 ngx-webcam v^0.3.2

I have used ngx-webcam library to capture photo through webcam. It is working fine in my local when i run the project with ng serve but it fails when I deploy the application to Apache server. ng build

[basst314]

Hi @hpardess What’s the exact issue/error you’re seeing? Make sure to run the app over https:// as with http:// browsers will not allow camera access.

[mtss92]

Hi I have the same problem but I get no errors.

<webcam   (imageCapture)="onTakePicture($event)"
                        [allowCameraSwitch]="'true'"  [trigger]="triggerObservable"
                        [imageQuality]="1"  [switchCamera]="nextWebcamObservable"
                        (initError)="handleInitError($event)"
                ></webcam>

  private trigger: Subject<void> = new Subject<void>();
  private nextWebcam: Subject<boolean|string> = new Subject<boolean|string>();

public get triggerObservable(): Observable<void> {
    return this.trigger.asObservable();
  }

  public get nextWebcamObservable(): Observable<boolean|string> {
    return this.nextWebcam.asObservable();
  }

  public handleInitError(error: WebcamInitError): void {
    if (error.mediaStreamError && error.mediaStreamError.name === "NotAllowedError") {
      alert("Camera access was not allowed by user!");
    }
  }

After I served it: $> http-server .\dist\ Starting up http-server, serving .\dist\ Available on: http://172.17.47.17:8080 http://192.168.1.9:8080 http://192.168.152.1:8080 http://192.168.58.1:8080 http://127.0.0.1:8080

The browser only asked me for the camera permission on the last address: http://127.0.0.1:8080 And other addresses display a blank page without any error.

[mtss92]

I solved my problem with the ssl:

$> http-server .\dist\ -S -C .\ssl\cert.pem -K .\ssl\key.pem Starting up http-server, serving .\dist\ through https Available on: https://172.17.47.17:8080 https://192.168.1.9:8080 https://192.168.152.1:8080 https://192.168.58.1:8080 https://127.0.0.1:8080

The problem was resolved at all addresses.

[basst314]

Thanks for confirming @mtss92. Yes you have to serve the app on a secure context using https://. Otherwise the browser won‘t allow access to user media / webcam. Closing this issue.