Einfügen und BLOB Bild in SQLite mit HTML5 und JavaScript

Question

Ich habe diesen kurzen JavaScript-Code abrufen, wo ich kann, Eingabedatensatz zu SQLite-Datenbank:

function insertRecord() // Get value from Input and insert record . Function Call when Save/Submit Button Click.. 

    { 

    var namamenutemp = $('input:text[id=namamenu]').val(); 

    var satuantemp = $('input:text[id=satuan]').val(); 

    var hargatemp = $('input:text[id=harga]').val(); 

    var stoktemp = '0'; 
    db.transaction(function (tx) { tx.executeSql(insertKasir, [namamenutemp, satuantemp, hargatemp], loadAndReset, onError); }); 
    } 
$("#submitButton").click(insertRecord); 

meines html zur Eingabe sqlite:

<input type="hidden" id="id"> 
<input id="namamenu" type="text" placeholder="Nama menu" required="" autofocus="" pattern=" "> 
<input id="satuan" type="text" placeholder="Contoh: PCS" required="" pattern=" "> 
<input id="harga" type="text" placeholder="Rp." required="" pattern=" "> 
<button id="submitButton" type="submit" >Save</button> 

und das ist meine Tabellenstruktur:

"CREATE TABLE IF NOT EXISTS Kasir (id INTEGER PRIMARY KEY AUTOINCREMENT, namamenu TEXT, satuan TEXT, harga TEXT)" 

und jetzt möchte ich ein Bild in meine Tabelle einfügen, und Ich habe festgestellt, dass es BLOB verwendet, aber ich weiß nicht, wie ich es auf meinem HTML5-Javascript verwenden soll.

Muss ich meine Tabellenstruktur auch ändern?

Answer 1

Das ist eine ähnliche Frage: wie man den Inhalt eines Bildes als base64 bekommt. Sieht so aus, als wäre die Methode spezifisch für Firefox, könnte aber auch in anderen Browsern funktionieren: Get image data in JavaScript?

Wenn das Bild auf der gleichen Domain ist, könnte man seinen Inhalt mit Ajax bekommen. Da Sie bereits mit jQuery würde es so aussehen:

$.get(imageUrl, function(result) { 
    console.log('binary image content', result); 
}); 

Wenn Sie das Bild anzeigen möchten, müssen Sie den Inhalt zu Base64 drehen, wie hier beschrieben: Embedding Base64 Images