Can a web-app be written such that it uses the browser to open, like NiceGUI or JustPy? I'd like to make a Windows application, but want to leverage the browser instead of creating my own GUI interface. Or does it depend on what it needs to do.. for example, I need to call DLLs. If the browser won't allow DLL calls, what about accessing the serial port (WebUSB , Web Serial API )? If the browser won't allow that either, then I assume you need to write a Progressive Web App using big frameworks (React, Angular, Electron, etc)? But if I have to develop a traditional exe, then perhaps there's not much advantage to go modern "web app", and instead should just use a traditional approach.... like using Python+Qt/Flet, or C++ (UWP, WPF, WinForms), Dart+Flutter?
Hello, I have a question Even though The uno board doesn't have Native you was able to see device information I see in the console login. Is it possible to display the hello world text in the webpage from the uno board?
Hello I have a question what happens If the Hardware ID is different? Example: I have two Arduino Leonardo both with different ID, Is there a way so no matter what ID is there It will connect to that device?
Yes, you can use the parameter filters in navigator.usb.requestDevice and add both the IDs: developer.mozilla.org/en-US/docs/Web/API/USB/requestDevice Example in the code that I used: github.com/hutscape/hutscape.github.io/blob/master/_tutorials/webusb-detect/webusb-detect.html#L10-L12
Hello Thank you very much for this video, but I was trying it with a Pro Micro and now Pro Micro doesnt work, I tried unBricking it, but no method worked, maybe you can help me, i tried the double reset and nothing, it still looks like a broken usb
Interesting! Pro Micro seems to have the 32u4 MCU on board and it is compatible hardware with webusb Arduino library: github.com/webusb/arduino#compatible-hardware
*2021 update* As of today, Chrome and Edge browsers are supporting Web USB, whereas Safari and Firefox are not. Please check the current browser compatibility: caniuse.com/webusb Web USB is not a W3C standard and it is currently in the draft stage: wicg.github.io/webusb/ Safari, based on the WebKit browser is not considering Web USB, for now, due to browser fingerprinting concerns. Please check webkit.org/tracking-prevention/#anti-fingerprinting As another optional reading, I suggest the article "Should The Web Expose Hardware Capabilities?" www.smashingmagazine.com/2021/01/web-expose-hardware-capabilities/ Hence, in my opinion, we can use Web USB in developer tools or in small-scale beta testing apps, but of course, you will be best aware of the context in which you plan to use this feature. Check out other exciting hardware API features such as Web NFC, Web Serial here web.dev/devices/ I detailed more on using hardware APIs on the web and using experimental technologies in another video of mine here ua-cam.com/video/InwV9jOx248/v-deo.html. I hope the above links will provide you with some guidance 🙏🏻
This is great, but why not make real-world example, how to connect devices such as scanners, printers, cameras, digitizing tables, etc? All videos are playing with a light or an arduino.
You are absolutely correct about the usefulness of connecting to scanners, printers, cameras, etc. For some devices like mouse, you can use the example I showed in 5:10 to detect USB devices on the browser. But for actual data exchange between an existing scanner/printer, etc and the browser, a considerable amount of reverse engineering will be required to understand whether the processor onboard these devices and then program it to send specific instructions to the browser. Hopefully one day soon this can be done!
Excellent. Thank you! I've been searching high and low for a simple explanation of this.
Thank you, adorable low pace explanation
how are we going to get around town 1❤ 0:00
Can a web-app be written such that it uses the browser to open, like NiceGUI or JustPy? I'd like to make a Windows application, but want to leverage the browser instead of creating my own GUI interface.
Or does it depend on what it needs to do.. for example, I need to call DLLs. If the browser won't allow DLL calls, what about accessing the serial port (WebUSB , Web Serial API )? If the browser won't allow that either, then I assume you need to write a Progressive Web App using big frameworks (React, Angular, Electron, etc)?
But if I have to develop a traditional exe, then perhaps there's not much advantage to go modern "web app", and instead should just use a traditional approach.... like using Python+Qt/Flet, or C++ (UWP, WPF, WinForms), Dart+Flutter?
Great explanation. thanks for putting it together!
Hello, I have a question Even though The uno board doesn't have Native you was able to see device information I see in the console login. Is it possible to display the hello world text in the webpage from the uno board?
Is this API works for the device that needs usb device driver?
hello...i love it...
thanks for sharing...
how to i do in windows ??
after creating index.html what should i do in cmd? pls help out...
I love asking questions, i love your videos too..
My Question is , Will this Work on Android when it is converted to an Apk ?
Oops! I have never coded for Android. But do check the browser compatibility and the version: caniuse.com/webusb
Thank you so much
Hello I have a question what happens If the Hardware ID is different? Example: I have two Arduino Leonardo both with different ID, Is there a way so no matter what ID is there It will connect to that device?
Yes, you can use the parameter filters in navigator.usb.requestDevice and add both the IDs: developer.mozilla.org/en-US/docs/Web/API/USB/requestDevice
Example in the code that I used: github.com/hutscape/hutscape.github.io/blob/master/_tutorials/webusb-detect/webusb-detect.html#L10-L12
hi,
will this work for esp32 as well??
This was super helpful. Thanks! :)
Hello
Thank you very much for this video, but I was trying it with a Pro Micro and now Pro Micro doesnt work, I tried unBricking it, but no method worked, maybe you can help me, i tried the double reset and nothing, it still looks like a broken usb
Interesting!
Pro Micro seems to have the 32u4 MCU on board and it is compatible hardware with webusb Arduino library: github.com/webusb/arduino#compatible-hardware
*2021 update*
As of today, Chrome and Edge browsers are supporting Web USB, whereas Safari and Firefox are not. Please check the current browser compatibility: caniuse.com/webusb
Web USB is not a W3C standard and it is currently in the draft stage: wicg.github.io/webusb/
Safari, based on the WebKit browser is not considering Web USB, for now, due to browser fingerprinting concerns. Please check webkit.org/tracking-prevention/#anti-fingerprinting
As another optional reading, I suggest the article "Should The Web Expose Hardware Capabilities?" www.smashingmagazine.com/2021/01/web-expose-hardware-capabilities/
Hence, in my opinion, we can use Web USB in developer tools or in small-scale beta testing apps, but of course, you will be best aware of the context in which you plan to use this feature. Check out other exciting hardware API features such as Web NFC, Web Serial here web.dev/devices/
I detailed more on using hardware APIs on the web and using experimental technologies in another video of mine here ua-cam.com/video/InwV9jOx248/v-deo.html. I hope the above links will provide you with some guidance 🙏🏻
This is great, but why not make real-world example, how to connect devices such as scanners, printers, cameras, digitizing tables, etc? All videos are playing with a light or an arduino.
You are absolutely correct about the usefulness of connecting to scanners, printers, cameras, etc.
For some devices like mouse, you can use the example I showed in 5:10 to detect USB devices on the browser. But for actual data exchange between an existing scanner/printer, etc and the browser, a considerable amount of reverse engineering will be required to understand whether the processor onboard these devices and then program it to send specific instructions to the browser.
Hopefully one day soon this can be done!