Read/Write and store data internelly in a Local App (no server) with JavaScript

Question

So I am making a local App using Javascript , React and Electron and I want it to be able to work just fine without internet.

I can't use 'localStorage' because the data might get deleted if the user deletes the cache.

I tried reading/writing using differant Modules, none of them worked mostly because of CROS. Using XMLHTTPrequests and Ajax doesn't work either and am running out of time.

When I use them on the test server, they return the index.html for the mainpage (They can at least access that ... and still they can't read the data) but when I try it on the build I get CORS the error.

My Idea for now is to enable CORS on my webpage since I have no worries about security : The App will run ONLY offline so there is no danger. But After many hours...I didn't find a solution to do it on the client side.

If anyone has an idea or suggestion I would be grateful.

I tried : fs,FileReader,FileSaver, $.ajax,XMLHTTPrequests

 //using $ajax
 var test = $.ajax({
        crossDomain:true,
        type: 'GET',
        url:'../data/DefaultCategorie.txt',
        contentType: 'text/plain',
        success: function(data){
            console.log(data);
        },
        error: function(){
            alert('failed');
        },

    })

 //using fs
 fs.readFile('../data/DefaultCategorie.txt', 'utf8', (err, data) => {
        if (err) {
            console.log("Failed");
            throw err
        }
        console.log(data);
        fs.close(data, (err) => {
          if (err) throw err;
        });
      });

Are you saying that you are using Node.js for the backend logic, and React Js for the front-end? — Asyranok, Mar 26 '19 at 20:06
Yes,+ some jquery and Electron will be added when I build the react-app — Med-Amine Benyettou, Mar 26 '19 at 20:09
So depending on the complexity of your app, you can simply save files with the data directly to the client machine. If the data is not complex, you will not need to use a database. You can read/write In this manner: https://stackoverflow.com/questions/2496710/writing-files-in-node-js — Asyranok, Mar 26 '19 at 20:10
Well ... I tried that ^^ You can see the code posted above, The thing is that I get :using test server : index.html , using build version : CROS error — Med-Amine Benyettou, Mar 26 '19 at 20:12
Sorry. I don't know how I missed that. What is a CROS error? Do you mean a CORS error? Cross origin? — Asyranok, Mar 26 '19 at 20:29
Have you tried anything expressed in this article. Looks like it can help to install a cors library in Node.js? https://medium.com/@alexishevia/using-cors-in-express-cac7e29b005b — Asyranok, Mar 26 '19 at 20:33
I installed it and now am getting some sort of error : TypeError: Cannot read property 'prototype' of undefined I searched and found I need to modify something in my webpack.config , but I don't have one — Med-Amine Benyettou, Mar 26 '19 at 20:47
Sounds to me that you are missing the specificities of browser / electron renderer security restrictions. Whereas the electron main can indeed access the file system. — ghybs, Mar 27 '19 at 10:13

score 0 · Accepted Answer · answered Mar 27 '19 at 08:57

This article covers the 3 most common ways to store user data: How to store user data in Electron

The Electron API for appDatadoes what you want. It is very easy to use.

From the above article:

const userDataPath = (electron.app || electron.remote.app).getPath('userData');
this.path = path.join(userDataPath, opts.configName + '.json')
this.data = parseDataFile(this.path, opts.defaults);

function parseDataFile(filePath, defaults) {

  try {
    return JSON.parse(fs.readFileSync(filePath));
  } catch(error) {
    // if there was some kind of error, return the passed in defaults instead.
    return defaults;
  }
}

Docs

app.getPath(name)
name String
Returns String - A path to a special directory or file associated with name. On failure, an Error is thrown.

You can request the following paths by the name:
appData - Per-user application data directory, which by default points to:
    %APPDATA% on Windows
    $XDG_CONFIG_HOME or ~/.config on Linux
    ~/Library/Application Support on macOS

userData - The directory for storing your app's configuration files,
which by default it is the appData directory appended with your app's
name.

Thank you very much ! I managed to make it work but only on the electron app, do you know any possible way to make it work from the test server on the browser ? (Well actualy that's my problem : CORS ..) and express is not working for me. — Med-Amine Benyettou, Mar 27 '19 at 11:33

Read/Write and store data internelly in a Local App (no server) with JavaScript

1 Answers1