25

I'm taking an image from the webcam and storing it to the server. Everything was working fine until I got the chrome update today. My latest chrome version is:

Version 71.0.3578.80 (64 bit)

This line is throwing an error:

camera.src = window.URL.createObjectURL(stream); 

Failed to execute 'createObjectURL' on 'URL': No function was found that matched the signature provided.

According to this link here. I applied the code

try { this.srcObject = stream; } catch (error) { this.src = window.URL.createObjectURL(stream); } 

Its not displaying the camera feed.

For reference - This jsfiddle code is not working on my chrome anymore.

4 Answers 4

26

It's just been removed from the current version of Chrome. I suddenly started getting this error after it updated. I have no idea why it never printed deprecation warnings before today.

Instead of setting the src property to URL.createObjectURL(stream) you're now supposed to set the srcObject property to the stream directly. It seems to be working in Chrome and Firefox.

Source: https://developers.google.com/web/updates/2018/10/chrome-71-deps-rems

Sign up to request clarification or add additional context in comments.

Comments

21

Since google update version 71, this issue is generating. I also faced this issue. But now I got the solution to it. Here is the solution:

Replace

videoElement.src = URL.createObjectURL(screenStream); 

to

videoElement.srcObject = screenStream; 

5 Comments

is videElement free to change into another name? like can I change videoElement into img.srcObject = screenStream? or another name? to it have rule for naming the const?
It's a video element that means it's an element in which the video will be playing. Its name can be whatever you want.
my code is like this <img src={URL.createObjectURL(screenStream)} /> so how I can convert into videoElement.srcObject = screenStream?
I am downloading word doc as saveAs(result, name+'_resume.pdf'); in this case how its is?
@NithinPaul It's only for live video calling, not for downloads. To download you can do one thing. Record the whole call and then do download the same.
6

Have you tried this?

try { camera.srcObject = stream; } catch (error) { camera.src = window.URL.createObjectURL(stream); } 

Comments

5

In chrome, it works fine if you use:

video.srcObject = stream; 

Instead of:

this.srcObject = stream; 

See printscreen here

4 Comments

Nice work. Does this also work for mobile browsers as well?
Yes, I am using it in my own camera app.
in video.srcObject, can I change video into another const name? like img or etc. ?
Hello @jhon, yes, absolutely, "video" is just the name of the video element: var video = document.getElementById('video'); but it could be: var my_image = document.getElementById('video');

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.