Ngx Webcam with angular | Accessing the webcam in angular | Capturing image the live image
ฝัง
- เผยแพร่เมื่อ 8 ก.ย. 2024
- In this video you will learn how to access webcam in angular. How to capture image and preview an image using ngx-webcam in angular.
How you can get the image as Data URL and base 64 string.
Github link with all the code access:
github.com/sai...
To know about angular concepts click on the below playlist link
• Angular Tutorials
To know about Angular Reactive forms click on the below playlist link
• Angular Reactive forms
To know about Angular unit testing click on the below playlist link
• Angular Unit Testing
To know about Angular Reactive forms Unit testing click on the below playlist link
• Angular Unit Testing
To know about Javascript concepts click on the below playlist link
• Concepts of JavaScript
To know about Javascript Objects click on the below playlist link
• Javascript Objects
#angular #ngx-webcam #webcam #ngx #livestreaming
you are a hero man great video, very simple and well explained thanks bro
Welcome 🙏 thanks a lot
So helpful and actually works, thank you!
Thank you Alex Oxley 🤟
Muchas gracias amigo, logre avanzar en mi proyecto gracias a ti, un saludo desde Guatemala
Thank you.
Well done ❤
hii, so its so helpful, thank you.. it is working on desktop with webcam and also loptop and mobile but not able to open front camera in mobile with this
First a fall thank you.
For your question there is a property called allowCameraSwitch which will receive boolean value you can add this property as input property for webcam selector and the. You can see the switching camera option.
Even there is an output event called cameraSwitched which will be emitted when we switch camera and you can do some functionality even there if you want to
helped so much, thank you
awesome work, really helped out
Thank you
thank you so much. very very helpful. new subscriber
thank you so much
good job
Why doesn't the camera activate on an Android device? ...On devices with Windows and/or Mac iOS it works correctly
The plugin is related to web access but for android it should have confirmation and access should be allowed
We have to make other logics for it to make the access for android devices
Hi bro How can save captured image into any folder or create new folder and save that image
If you want to download that image we can do that by using some download logic and that stores in local system
How to access scanner device, that was connected to my cpu through usb, now how to read qr codes with that scanner in angular. Iam using scanner Zebra DS2200 device
When I connect external devices those are not showing in navigator.mediadevices object, I think due to chrome security policy not allowing to access
Yeah could be security policy try disabling security policy and a new browser will open it think you can try that way
There is a case which we did but to scan something we may need to have mobile chipset and that should be connected to your scanner and that should passed to chip set chip set should pick the data and showcase that on the UI of your browser… by using some backend services
May be try this way and investigate
I did not work on this type of scenario but there is a chance to do this way
@@techshareskk yaa, okk bro I will try and thanks for you reply
@Techshareskk It's working on server system or not, I mean I have implement that functionality for image capture then deploy the code on server, now that functionality is working on all ip?
Yeah it will never depend on the servers or Ip
How to set maximum resolution for download file?
0.92 is the maximum image quality you can set and you can use imageQuality property
Really GREAT! But i am getting image in reverse mode. If i could send an screen shoot i could show the actual fact. Please reply....
Sure bro just ping me over Instagram @techshareskk
Hello, this has been very helpful thank you.
Is there a way I can use the captured image and send it to a storage as an image object and not base64 or image url?
You can do it as image URL.
Hi, mi webcam it isn't getting width and height from this code
video:{
width:500,
height:500
}
Instead, it show me the megapixels quality, if I write 1080 or more (in Width and Height), quality increases and not window size. I'm working in laptop Dell with integrated camera, not extern webcam... Could be that?
Width and height property should only increase the size but not the quality can you check exactly how are you giving this configurations ?
Image quality is the property which increase the quality of an image after capturing from the webcam.
@@techshareskk Yes, I was check it line by line, but doesn' matter :)
Other question: How I can save the photo file in my project folder?
I didn't found anything about that :(
You have to use file saver npm and you can pass the base64 or image format to that and can save that image
Nice Job! How can we capture a video and save it?
You cant capture complete videos it may need some streaming mechanism and should save the streams to save them as video 📹 .
Hey @sai, is there any zoom pption avaialble for this plugin tried my best but didnt find any
Neee to do a work around kishore.
would there be a way to add a button to download the image after capturing?
We can do that storing that values
how to get live stream through ip camera ?
For that we need to access live streaming using some node js or any other libraries
@@techshareskk can u please help in that. I need to stream live feed of ip camera
@@S.h.iv.an.i sure will check that and will try to make the video on this. Please send me exact requirements so that i can try it out the same way you are expecting
@@techshareskk can we connect on linkedin?
@@S.h.iv.an.i sure you can search on my name Sai Kumar korthivada
can we capture on mobile as well!!
How can we capture multiple images and proceed them? Is it possible, how can i achieve it
Good question. I did not tried on mobile devices but as per my knowledge this has to work even on mobile with some small minor code changes.
Anyway will clone that and will make you clear on this Hasitha
@@techshareskk Okay sure Thank you and can we capture multiple images and proceed them?
Ha you can capture each image and store in one array so you can proceed further.
I tried this on mobile it is working but you should make sure your application is running in https server when you are using in mobile other wise this will not work without secured URL.
how to stop the stream?
By using some conditions you should hide the webcam component from the html and then it stops streaming and when you want enable that condition
@Techshareskk It's working on server system or not, I mean I have implement that functionality for image capture then deploy the code on server, now that functionality is working on all ip?
It should work even in all the IPs until we are not allowing to use webcam
This will not depend on IPs or servers it always depends on the system browser and permissions given for camera access