Webcam js error webcam is not loaded yet

Here’s the error whenever I clicked the camera button to take the second picture.

Here’s the HTML code:

<div class="list-buttons">
    <button class="btn btn-default btn-camera btn-violet" data-toggle="modal" data-target="#camera-modal" data-backdrop="false">
        <i class="fa fa-camera"></i>
    </button>
</div>

<div class="take-picture">
  <div class="row all-pictures">
  </div>
</div>

<div class="modal fade" id="camera-modal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <div class="row">
                    <div class="col-xs-9">
                        <h5>Take a Picture</h5>
                    </div>
                    <div class="col-xs-3">
                        <button type="button" class="btn btn-default pull-right" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
            <div class="modal-body" style="padding:0px 0px 32px 0px;">
                <div id="my_camera"></div>
                <div class="list-buttons" style="display: flex; justify-content: space-between; margin: 20px;">
                <button class="btn btn-default btn-violet btn-take">
                    <i class="fa fa-camera-retro"></i>
                </button>
                <button class="btn btn-default btn-violet btn-take">
                    <i class="fa fa-camera-retro"></i>
                </button>
                </div>
            </div>
        </div>
    </div>
</div>

Here’s the JS code:

$('#camera-modal').on('show.bs.modal', function (event) {
      Webcam.set({
        width: 800,
        height: 600,
        image_format: 'jpeg',
        jpeg_quality: 90
      });
      Webcam.set("constraints", {
        facingMode: "environment"
      });
      Webcam.attach( '#my_camera' );
      
      $('.btn-take').on('click', function() {
        Webcam.snap( function(data_uri) {
          console.log("test")
          $('.all-pictures').append(''+
            '<div class="col-lg-4 col-md-4 col-sm-4 col-xs-6">'+
                '<img loading="lazy" src="'+data_uri+'" class="img-responsive">' +
            '</div>');
        } );
        $('[data-dismiss="modal"]').click();
      })
})
$('#camera-modal').on('hide.bs.modal', function (event) {
            console.log("MODAL CLOSED")
      Webcam.reset( '#my_camera' );
});

Please check this fiddle right here: https://jsfiddle.net/38qdco6j/4/

To replicated the error:

1. Click the camera icon
2. Take a picture, click the camera icon inside the modal
3. Repeat 1 and 2

Another one is:

1. Click the camera icon
2. Close the modal
3. Click again the camera icon
4. Take a picture, click the camera icon inside the modal

Please help how to fix that one. Thank you!

Not working in Firefox and Internet Explorer #4

I have been trying webcamjs and it works perfectly in Google Chrome.
But when I tried it in Firefox and Internet Explorer it does not work at all.

Tried even using your demo url and it doesn’t work.
If I click at Take Snapshot I get: «Webcam.js Error: Webcam is not loaded yet»

So this is only working in Chrome for now.

The text was updated successfully, but these errors were encountered:

Should be fixed in IE 11 now, sorry about that. Not sure why your Firefox isn’t working. Do you have the latest version (v27)? I have it working in Firefox 27 on Windows 7 and OS X 10.8.

If you could, please try this demo URL (it forces Flash mode):
http://pixlcore.com/demos/webcamjs/flash.html

Let me know if that works. Thanks.

Now it works in IE 11.
I tested on my desktop with Firefox 27 and it works.
But in my laptop I had Firefox 19, and there it doesn’t work. After updating to 27 it works.

If you set up the Flash fallback for older versions of Firefox it would be highly appreciated. (Im not sure since what version of firefox the HTML5 webcam works)

Ah, I see. Good idea, I went ahead and did that. CanIUse.com declares that Firefox 21 and up support userMedia, so I put in an automatic disable on FF versions under 21. Thanks!

I tested in FF R32 but do get the same error «Webcam.js Error: Could not access webcam» once I allow the camera to be shared. With Chrome no issue. IE11 is not working neither, failing back to Flash works (I get the window where I can click «Agree» to share the camera) but the nothing 🙁

still not working in IE11. please help, showing error, webcam.js Error : could not access webcam.
please help

@yogendrakarekar I’m sorry, I cannot reproduce your issue. WebcamJS is working just fine on my Win7/IE11 machine. Screenshot below:

Here are a few things for you to try:

• Remember, you must have Adobe Flash for IE 11 to work.
• Do not try any WebcamJS demos running on your local PC’s Hard Disk. Flash needs the page to be hosted on a remote server (with an http:// address) to access the camera.
• Make sure your camera preview size is large enough. Adobe Flash can only show its dialogs if there is enough space. 320×240 or larger.
• Disable ad blockers. Many of them block Flash.
• Disable all your browser extensions. One of them may be interfering with Flash.
• Make sure you have a working webcam with the appropriate drivers.
• Make sure IE and Windows are both up to date.
• Make sure Adobe Flash is up to date.
• Try jQuery Webcam: http://www.xarg.org/project/jquery-webcam-plugin/
• Try JpegCamera: https://github.com/amw/jpeg_camera

Good luck, and sorry I could not help.

@jhuckaby dats k, i’ll look into it. actually the thing is dat it is also not asking me for adobe flash updation. even not giving me the error webcam error: could not run webcam.
but anyways thanks for help

Источник

webcam.js, could not access webcam in chrome and opera. #37

having issues with chrome and other browsers when users reject the broswer dialog the very first time. it keeps displaying webcam.js error everytime the page is reloaded. please, anyway i can work around that?

The text was updated successfully, but these errors were encountered:

Hi,
Try yo get again the dialog and give it access to webcam, then recharge the
page again.

Best regards.
El 14/10/2014 14:35, «ray86» notifications@github.com escribió:

having issues with chrome and other browsers when users reject the broswer
dialog the very first time. it keeps displaying webcam.js error everytime
the page is reloaded. please, anyway i can work around that?
[image: capture-20141014-053232]
https://cloud.githubusercontent.com/assets/9213837/4628951/559d8fc8-539e-11e4-8f74-59c037cf488e.png

—
Reply to this email directly or view it on GitHub
#37.

This appears to be «as designed» behavior in Chrome. It remembers the user’s decision to block the device, and on reload instead of asking the user again, it instantly denies access, firing the error callback. If the user changes his/her mind and wants to re-allow the camera, (s)he has to click on the blocked camera icon in the right side of the location bar, and change the setting:

Источник

Помощь

Odoo is the world’s easiest all-in-one management software.
It includes hundreds of business apps:

How to take picture from webcam?

I have a picture field now how to take customer picture by this field automatically ?

not working, now what can i do?

2Ответы

Functionally qualified expert with 9 plus years of experience in Odoo projects Implementation. Having strong knowledge of Odoo fundamentals and successfully implemented plenty of projects which is in domestic and international market.

@ Arjun Baidya.. Please try this module in your localhost, because might WebcamJs works only over HTTPS or localhost.

Odoo Techno Functionalist

Working as Odoo developer @ Walnut Software Solutions, Kuwait

Looking for Odoo support in Kuwait, ping me officially niyas@walnutit.com

Feel free to connect : niyasraphyk@gmail.com

Use this module which provides a widget that can capture image using web cam. See: Web Widget — Image WebCam

try this in v13 and see whether it works, if not made necessary adjustments to make it work in v13. Thanks

how i connect my app, kindly tell me

For you to install the above in odoo13, am REPEATING, try installing same in v13 and see.

Webcam.js Error: No supported webcam interface found.

Webcam.js Error: Webcam is not loaded yet

this erroe show

can you help me?

@niyas it is working perfectly on local machine but giving this on server
Webcam.js Error: No supported webcam interface found. any idea?

Odoo is a suite of open source business apps that cover all your company needs: CRM, eCommerce, accounting, inventory, point of sale, project management, etc.

Odoo’s unique value proposition is to be at the same time very easy to use and fully integrated.

Источник

Not working in Firefox and Internet Explorer about webcamjs HOT 9 CLOSED

Should be fixed in IE 11 now, sorry about that. Not sure why your Firefox isn’t working. Do you have the latest version (v27)? I have it working in Firefox 27 on Windows 7 and OS X 10.8.

If you could, please try this demo URL (it forces Flash mode):
http://pixlcore.com/demos/webcamjs/flash.html

Let me know if that works. Thanks.

emisand commented on January 16, 2023

Now it works in IE 11.
I tested on my desktop with Firefox 27 and it works.
But in my laptop I had Firefox 19, and there it doesn’t work. After updating to 27 it works.

If you set up the Flash fallback for older versions of Firefox it would be highly appreciated. (Im not sure since what version of firefox the HTML5 webcam works)

jhuckaby commented on January 16, 2023

Ah, I see. Good idea, I went ahead and did that. CanIUse.com declares that Firefox 21 and up support userMedia, so I put in an automatic disable on FF versions under 21. Thanks!

JeronimoBurgers commented on January 16, 2023

I tested in FF R32 but do get the same error «Webcam.js Error: Could not access webcam» once I allow the camera to be shared. With Chrome no issue. IE11 is not working neither, failing back to Flash works (I get the window where I can click «Agree» to share the camera) but the nothing 🙁

yogendrakarekar commented on January 16, 2023

still not working in IE11. please help, showing error, webcam.js Error : could not access webcam.
please help

jhuckaby commented on January 16, 2023

@yogendrakarekar I’m sorry, I cannot reproduce your issue. WebcamJS is working just fine on my Win7/IE11 machine. Screenshot below:

Here are a few things for you to try:

• Remember, you must have Adobe Flash for IE 11 to work.
• Do not try any WebcamJS demos running on your local PC’s Hard Disk. Flash needs the page to be hosted on a remote server (with an http:// address) to access the camera.
• Make sure your camera preview size is large enough. Adobe Flash can only show its dialogs if there is enough space. 320×240 or larger.
• Disable ad blockers. Many of them block Flash.
• Disable all your browser extensions. One of them may be interfering with Flash.
• Make sure you have a working webcam with the appropriate drivers.
• Make sure IE and Windows are both up to date.
• Make sure Adobe Flash is up to date.
• Try jQuery Webcam: http://www.xarg.org/project/jquery-webcam-plugin/
• Try JpegCamera: https://github.com/amw/jpeg_camera

Good luck, and sorry I could not help.

yogendrakarekar commented on January 16, 2023

@jhuckaby dats k, i’ll look into it. actually the thing is dat it is also not asking me for adobe flash updation. even not giving me the error webcam error: could not run webcam.
but anyways thanks for help

yogendrakarekar commented on January 16, 2023

@jhuckaby when I open your demo page in ie11 it works but when i try to implement it on localhost it does not works. it does not gives a popup for adobe or webcam.js error, shows nothing, just a blank div

jhuckaby commented on January 16, 2023

Read what I said above:

• Do not try any WebcamJS demos running on your local PC’s Hard Disk. Flash needs the page to be hosted on a remote server (with an http:// address) to access the camera.

• Webcam.js Error: No supported webcam interface found HOT 2
• Demo Website Not Working in Chrome, Works in IE and Microsoft Edge HOT 2
• On the problem that the func function in snap function is undefined
• Webcam Not working for IE11 in React project HOT 1
• No supported webcam interface is found
• I am using webcam.js plugin to use camera in web app. But i am not getting solution for choose front or rear camera choice. please give me some solution to use camera choice. HOT 1
• Iphone open device camera instead of web camera
• How to turn off after snapshat?
• Capture webcam in IE11 HOT 2
• webcam.js displays black screen on initialization in android webview
• webcam.swf’s allowDomain * detected as potential vulnerability HOT 1
• Unable to switch to rear camera even after using facingMode as environment (On Android mobiles) HOT 5
• Webcam.js Error: Could not access webcam: NotAllowedError: Permission denied NotAllowedError: Permission denied
• Remove Red Icon on browser tab HOT 1
• Webcam.Snap firing more than once
• Facial guideline on canvas
• Edge Mobile (Android) requires video.play();
• Plain Green image returned on some android devices
• When webcam node is hidden, live images are not getting captured properly in safari HOT 1
• Demo links are broken HOT 2

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.

Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

TensorFlow

An Open Source Machine Learning Framework for Everyone

Django

The Web framework for perfectionists with deadlines.

Laravel

A PHP framework for web artisans

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

Some thing interesting about web. New door for the world.

server

A server is a program made to process requests and deliver data to clients.

Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

Visualization

Some thing interesting about visualization, use data art

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.

Microsoft

Open source projects and samples from Microsoft.

Источник

Webcam.js Error: No supported webcam interface found about webcamjs HOT 2 OPEN

Even I am facing the same issue

tons613 commented on January 16, 2023

The browser requires that the camera is accessed via https://

• Demo Website Not Working in Chrome, Works in IE and Microsoft Edge HOT 2
• On the problem that the func function in snap function is undefined
• Webcam Not working for IE11 in React project HOT 1
• No supported webcam interface is found
• I am using webcam.js plugin to use camera in web app. But i am not getting solution for choose front or rear camera choice. please give me some solution to use camera choice. HOT 1
• Iphone open device camera instead of web camera
• How to turn off after snapshat?
• Capture webcam in IE11 HOT 2
• webcam.js displays black screen on initialization in android webview
• webcam.swf’s allowDomain * detected as potential vulnerability HOT 1
• Unable to switch to rear camera even after using facingMode as environment (On Android mobiles) HOT 5
• Webcam.js Error: Could not access webcam: NotAllowedError: Permission denied NotAllowedError: Permission denied
• Remove Red Icon on browser tab HOT 1
• Webcam.Snap firing more than once
• Facial guideline on canvas
• Edge Mobile (Android) requires video.play();
• Plain Green image returned on some android devices
• When webcam node is hidden, live images are not getting captured properly in safari HOT 1
• Demo links are broken HOT 2

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.

Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

TensorFlow

An Open Source Machine Learning Framework for Everyone

Django

The Web framework for perfectionists with deadlines.

Laravel

A PHP framework for web artisans

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

Some thing interesting about web. New door for the world.

server

A server is a program made to process requests and deliver data to clients.

Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

Visualization

Some thing interesting about visualization, use data art

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.

Microsoft

Open source projects and samples from Microsoft.

Источник

Webcam.js Error: Could not access webcam.
Permission Error: Only secure origins are allowed

Webcam.set({
      width: 320,
     height: 240,
     dest_width: 320,
     dest_height: 240,
     image_format: 'jpeg',
     jpeg_quality: 90,
     force_flash: false
    });
    Webcam.attach( '#my_camera' );

6 ответов

Лучший ответ

https://example.azurewebsites.net/ 

http://example.azurewebsites.net/

 Webcam.set({
        force_flash: true
 });

Webcam.set({
    width: 500,
    height: 400,
    image_format: "jpeg",
    jpeg_quality: 90,
    force_flash: false,
    flip_horiz: true,
    fps: 45
});

Webcam.set("constraints", {
    optional: [{ minWidth: 600 }]
});