I need to save various user files (mostly images) that are uploaded via a HTML input field into a MySQL database. My goal is to store the arrayBuffer of these files in a MySQL blob using @mysql/xdevapi.
Current setup:
- Using Angular with Electronjs
- MySQL database accessible through my app with @mysql/xdevapi
Progress so far:
Retrieving the input file:
processInputFile(event) {
var file: File = event.target.files[0];
file.arrayBuffer().then((value) => {
this.fileToStore = value;
});
Executing MySQL query (updating columns "user_comment" and "user_file" in the "step" table):
UpdateStep = (step: TestSteps, fileToStore: ArrayBuffer): Promise<void> => {
return new Promise<void>((resolve, reject) => {
if (this.session === undefined) {
reject(new Error('session is undefined'));
return;
}
var sch = this.session.getSchema("gtb");
var step_table = sch.getTable('step');
step_table.update().set('user_comment', step.user_comment).set('user_file', fileToStore).where('id = ' + step.id).execute().catch(error => { console.error(error); });
resolve();
})
}
After downloading the blob in MySQL Workbench, the file size appears to be only 2kb while the original is 165kb. What could be causing this issue? Additionally, how can I retrieve the file for user download?