Objekt mit Funktionen in Localstorage speichern?

Hey,

ich würde gerne ein Objekt in den Localstorage speichern, das auch Funktionen enthält. Das Problem ist jedoch, dass die Funktionen nicht mir gespeichert werden. Ist das überhaupt möglich und wenn ja wie?

let data = {
    user: _user,
    enemy: _enemy,
    settings: 'settings'
}
localStorage.setItem('fg:data', JSON.stringify(data));

_user ist ein Objekt, das Funktionen beinhaltet, die nicht im Localstorage auftauchen.

Answer 1

[zooper]

Warum möchtest du dies machen? Du solltest es nicht machen wenns nicht einfach zum ausprobieren ist.

Es ist unsicher, Angreifer können einfach die Funktion im localstorage ändern, und dann Passwörter etc. auslesen wenn du sie wieder ausführst. Mach es nicht.

Dein Code funktioniert nicht weil json.stringify eine flache Kopie eines Objektes macht. D.h. alle Werte die referenzen sind (andere Objekte, funktionen) werden nicht mitkopiert.

Alternativ würde es so gehen.

var myFunc = function (){
  alert('Hello world!');
};

// Store it as a String
localStorage.setItem('compressedFunc', myFunc.toString());



// retrieve it from storage
var compressedFunc = localStorage.getItem('compressedFunc');

// Convert the String back to a function
var myFunc = eval('(' + compressedFunc + ')');

// Use it
myFunc();

Woher ich das weiß: Studium / Ausbildung

Comments

[User3278964]

Ich weiß, was ich mache. Ich habe selber Erfahrung und würde niemals Passwörter o.ä. im Front-End/Client liegen lassen. Ich möchte das ganze tun, weil ich mich zurzeit auf meine Zukunft als Front-End Webdeveloper vorbereite. Dafür programmiere ich zurzeit ein sehr komplexes Spiel in Angular, das alle Daten im localstorage speichert. Natürlich würde man diese Daten normalerweise im Back-End speichern und mit einem Account System arbeiten. Ich möchte jedoch vorerst Front-End Developer werden und dann langsam aber vorsichtig mit Full-Stack in Berührung kommen. Dennoch danke für deine Warnungen^^

[zooper]

@User3278964

Wie gesagt, du solltest trotzdem nie Funktionen ablegen müssen. Es geht nicht darum das du passwörter dort abspeicherst, sondern die Funktion benutzt werden kann um andere Passwörter rauszufinden.

Answer 2

[regex9]

Das Problem ist jedoch, dass die Funktionen nicht mir gespeichert werden.

Bei einer Serialisierung zu JSON wird nur das mitgenommen, was von JSON unterstützt wird. Function-Objekte gehören nicht dazu.

Ist das überhaupt möglich und wenn ja wie?

Du kannst den Callback verwenden, den die stringify-Methode als zweites Argument mit aufnimmt. In diesem prüfst du, ob sich der aktuell zu serialisierende Wert um eine Funktion handelt. Wenn ja, wandelst du sie in einen String um. Kontextinformationen gehen dabei aber natürlich verloren.

const json = JSON.stringify(yourObject, (_, value) => {
  if (typeof value === "function") {
    return value.toString();
  }

  return value;
});

Beim Einlesen müsstest du die entsprechenden Werte via eval ausführen.

Ich würde allerdings eher dazu raten, reine Daten und Funktionen bei einer Speicherung voneinander zu trennen. Wenn du Funktionen mit serialisierst, verbrauchst du nur Speicherplatz und auch die spätere Evaluierung nimmt unnötig Ressourcen weg.

Answer 3

[holycow1912]

JSON.stringify kann nur simple Objekte verarbeiten. Funktionen (oder Objekte mit Typen wie nach ES6) verlieren ihre Informationen beim serialisieren.

Woher ich das weiß: Berufserfahrung – Softwareentwickler