Introduction to the Chrome File System Access API
Вставка
- Опубліковано 1 сер 2024
- Hello, my friends and fellow developers, I gave an introduction to how the new File System Access API works in Chrome and other Chromium-based browsers like Edge, Brave, etc.
Let me know in the comments below if you want more JavaScript videos or any other videos.
🔴 Subscribe here: bit.ly/2K5Ydaf
⌨ Localhost Discord Server: / discord
Links in the video:
FS API docs: web.dev/file-system-access/
FS API detailed docs: wicg.github.io/file-system-ac...
Other Tutorials:
⚛️ React and Material UI Todo App: bit.ly/reactmattodo
🟨 Other JavaScript videos: bit.ly/jstutorials
📘 Visual Studio Code videos: bit.ly/vscodevids
🔋 Build a Battery App in JS: • 🔋 Build a Battery Info...
Connect 🔗 :
Twitter: / maxprogramming1
Facebook: / max-programming-103081...
GitHub: github.com/max-programming/
🎥 Gear I use:
🎤 Mic: amzn.to/3DGqEH9
🎙️ Mic Holder: amzn.to/3NAnM2U
🎧 Headphones: amzn.to/3Wy7CuZ
⌨ Keyboard: amzn.to/3E2mSci
📷 Webcam: amzn.to/3Tb0Ice
VS Code Theme used: codeSTACKr Theme
Suggest, ask doubts in the comments and share these videos to help!
Thanks for Watching!
Awesome video! This is so much better than using the file input element :D
Absolutely! It really is!
@@MaxProgrammingBro this code work for android users or not because I make something but it not work please reply me if it work on android than I work on it because I change html file into apk by WebView and launch for android . You have any idea ?
Very Easy to understand.
Thank you very much.
Glad to hear that
Love to see you back!!
Welcome back and by the way great video.
Thanks buddy!
great job max, keep up!
Thanks 😃
Useful great
Keep it up
Nice video bro keep on doing more man
Thank you 😄
hey, nice video:) Can you directly set a path/to/file and the name of file to read and write? so that user don't have to select the file?
Hey, thank you!
You could specify a start directory in the options which is passed in showOpenFilePicker().
But I don't think you can pass in a fixed path.
Read about it here: wicg.github.io/file-system-access/#api-filepickeroptions-starting-directory
How we can save ot download the file by using this file system api using js and java
You can read about saving files here on their official docs: web.dev/file-system-access/#write-file
Nice video. Please can you create an image preview on file upload using Chrome File System Access API and all browser support.
You can select an image using this Filesystem API and also you can preview that on the web page. But it's only for Chromium-based browsers like Chrome, Edge, Brave, etc. Doesn't work on Firefox as of now.
The video on uploading and viewing image will be out soon ✌️
how can one target firefox and safari for the file system api - are there work around solutions?
You can use the navigator.userAgent in JavaScript to check on which browser the user is. And use the input tag if the browser is not chrome or chromium-based.
Would you like to see a video on this very topic 🤝?
@@MaxProgramming i personally would not see that tutorial because you explained in clearly above. My suggestion would be to make one only IF you think it would benefit others, and if you WANT to do one.
Thanks for the suggestion. Glad you understood it ✌
good video
what if user cancels the uploading file!?
Cancels while the file is uploading or in the file picker?
@@MaxProgramming in the file picker
@@imsjpinternal9554 Nothing will happen. It'll show an error in the console that user cancelled. You can use try catch block to show a message in the UI
@@MaxProgramming Thank you so much
I dont think this works when the environment is not secure. For localhost or 127.0.0.1, it is fine. For a real world application, it does not.
For a real world app if it's HTTPS I think it does work