javascript – On iOS: Person permits digicam however the video factor is clean & console error “Unhandled Promise Rejection: NotAllowedError”

Why do I get Unhandled Promise Rejection: NotAllowedError even after the person permits the digicam for the web page?

I’ve a webpage that’s requesting the digicam and streaming it to a video factor on the web page. It really works on my laptop computer (chrome), however on iOS (safari & chrome), the video factor is clean, and there is a console error saying

Unhandled Promise Rejection: NotAllowedError: The request shouldn't be allowed by the person agent or the platform within the present context, presumably as a result of the person denied permission.

and the road quantity for the exception is on the road that performs the video this.video.play(). See under.

HTML

            <div class="digicam" class.bind="cameraLoading ? 'hidden' : ''">
                <video id="camera-view" ref="video">Video stream not accessible.</video>
                <div id="button-div">
                    <button id="capture-button" ref="captureButton">
                        <i class="fa fa-camera"></i>
                    </button>
                </div>
                <canvas id="overlay-canvas" ref="overlayCanvas"></canvas>
            </div>

JavaScript

        let constraints = {
            video: {
                width: {best: 2160},
                peak: {best: 2160}
            }
        }

        navigator.mediaDevices
            .getUserMedia(constraints)
            .then((stream) => {
                let videoTrack = stream.getVideoTracks()[0];
                let capabilities = videoTrack.getCapabilities();
                let best = Math.min(capabilities.width.max, capabilities.peak.max)
                videoTrack.applyConstraints({video: {best: best}, width: {best: best}, aspectRatio: 1})
                this.video.srcObject = stream

                this.video.play()

                setInterval(() => {
                    this.cameraLoading = false
                }, 50)
            })
            .catch((err) => {
                console.error(`An error occurred:`, err)
            })

Apparently, if I click on the button to seize the image. It does seize the image from the digicam. It is simply that the video stream is not attending to the video factor. Additionally, if I navigate to a special view after which come again to the digicam view with out ever reloading the web page (it is a single-page app), the video factor masses completely. Additionally, and I am undecided that is associated, it generally masses the video factor fullscreen.