Как я могу сохранить сгенерированное изображение QR-кода, используя угловой 5 - PullRequest
0 голосов
/ 30 июня 2018

<qrcode [qrdata]="'Your QR code data string'" [size]="256" [level]="'M'" ></qrcode>

Я создаю веб-сайт, где пользователи могут создавать qrcode. Всякий раз, когда генерируется qrcode, я хочу сохранить это изображение в файл и поместить имя изображения в базу данных. Но я понятия не имею, как я могу сохранить и загрузить это.

Ответы [ 2 ]

0 голосов
/ 24 июля 2018

Однако я нашел решение для моего вопроса. Я пробовал разные методы. Ни один из них, похоже, не работает. Я перечислю шаги ниже.

let dataurl = document.getElementById("canvas").innerHTML; 
// data get from html as base 64 image

let myRegexp = /(?:^|\s)src=(.*?)(?:\s|$)/g;

let match = myRegexp.exec(dataurl);

let match1 = match[1].replace('">', '');

let ImageURL = match1;

let block = ImageURL.split(";");

let contentType = block[0].split(":")[1];

let realData = block[1].split(",")[1];

let **file** = this.**dataURLtoFile**(ImageURL, 'testFile.png');

Чтобы преобразовать базу 64 в файл изображений Multipart, я следовал за строками ниже. имя изображения, которое я установил testfile.png

dataURLtoFile(dataurl, filename) {

 var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],

 bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);

 while(n--) {

  u8arr[n] = bstr.charCodeAt(n);

 }

 return new File([u8arr], filename, {type:mime});

}

наконец я отправил файл в формат formdata для остальных API.

Formdata.append("imagefile",file);
0 голосов
/ 01 июля 2018

Похоже, что angular2-qrcode имеет параметр 'canvas', который заставляет его рисовать на холсте.

Если вы можете заставить это работать, тогда вы должны быть в состоянии использовать технику, описанную в Захватывать HTML-холст как gif / jpg / png / pdf? , чтобы получить изображение с холста.

...