seit Version 78 bietet Google Chrome ein Native File System API an, mit dem es möglich ist, Dateien auf dem Gerät des Benutzers zu lesen und zu speichern.
Siehe auch: https://web.dev/native-file-system/
Hier eine einfache Demo in Form eines simplen Text-Editors. Die Besonderheit ist, dass man Dateien laden, verändern und speichern kann:
Code: Alles auswählen
EnableExplicit
Define myToken.s = "[YourToken]"
Define MetaTag.s = ~"<meta http-equiv=\"origin-trial\" content=\"" + myToken + ~"\">"
! $("head").append(v_metatag);
Global FileHandle
Enumeration
#Window
#LoadButton
#SaveButton
#SaveAsButton
#Editor
EndEnumeration
Procedure WriteFile(e, t.s)
! (async() => {
! // Create a writer (request permission if necessary).
! const i = await v_e.createWriter();
! // Make sure we start with an empty file
! await i.truncate(0),
! // Write the full length of the contents
! await i.write(0, v_t),
! // Close the file and write the contents to disk
! await i.close()
! })();
EndProcedure
Procedure LoadButtonEvent()
Protected FileContent.s
! (async() => {
! const opts = {
! type: 'openFile',
! accepts: [{
! description: 'Text file',
! extensions: ['txt'],
! mimeTypes: ['text/plain'],
! }],
! };
! v_filehandle = await window.chooseFileSystemEntries(opts);
! var file = await v_filehandle.getFile();
! v_filecontent = await file.text();
SetGadgetText(#Editor, FileContent)
SetActiveGadget(#Editor)
! })();
EndProcedure
Procedure SaveAsButtonEvent()
Protected FileContent.s = GetGadgetText(#Editor)
! (async() => {
! const opts = {
! type: 'saveFile',
! accepts: [{
! description: 'Text file',
! extensions: ['txt'],
! mimeTypes: ['text/plain'],
! }],
! };
! v_filehandle = await window.chooseFileSystemEntries(opts);
! if (typeof v_filehandle != "undefined") {
WriteFile(FileHandle, FileContent)
! }
! })();
EndProcedure
Procedure SaveButtonEvent()
! if (typeof v_filehandle === "undefined") {
SaveAsButtonEvent()
ProcedureReturn
! }
Protected FileContent.s = GetGadgetText(#Editor)
! (async() => {
WriteFile(FileHandle, FileContent)
! })();
EndProcedure
Procedure AddClickEventListener(Gadget, Callback)
Protected GID = GadgetID(Gadget)
! v_gid.div.addEventListener('click', async (e) => { v_callback(e) });
EndProcedure
OpenWindow(#Window, #PB_Ignore, #PB_Ignore, 800, 600, "Native FileSystem - Demo", #PB_Window_ScreenCentered)
ButtonGadget(#LoadButton, 10, 10, 80, 30, "Load")
ButtonGadget(#SaveButton, 100, 10, 80, 30, "Save")
ButtonGadget(#SaveAsButton, 190, 10, 80, 30, "Save as...")
EditorGadget(#Editor, 10, 50, WindowWidth(#Window) - 20, WindowHeight(#Window) - 60)
AddClickEventListener(#LoadButton, @LoadButtonEvent())
AddClickEventListener(#SaveButton, @SaveButtonEvent())
AddClickEventListener(#SaveAsButton, @SaveAsButtonEvent())