Как создать QR-код по строке и направить его пользователю на скачивание?
Суть такая. При нажатии на кнопку (onClick событие) должен создаваться QR-код(отображение для пользователя не нужно) по строке(рандомно генерирующийся набор символ) и отправляться на скачивание пользователю в виде png-картинки. Я видел библиотеки, которые просто отображают на странице QR-код, но его отображение в какой-либо файл для скачивания – не нагуглил пока что. Скачивание файла хотел реализовать при помощи атрибута download у тега Буду очень рад, если сможете подсказать способ р...
Дополнительно:
Делаю для себя одностраничное приложение:
https://gitverse.ru/NeiroN/HTML/content/main/QRcod...
Пошел по пути Текст->QRcode SVG->тег img->тег canvas->тег a->сохранение
function convertPng(svg,size,name){ let canvas = document.createElement("canvas");canvas.width=size;canvas.height=size; let img = new Image();img.width=size;img.height=size; let a = document.createElement("a");a.download=name; img.onload = function() {canvas.getContext('2d').drawImage(img, 0, 0);a.href=canvas.toDataURL("image/png");a.click();img.remove();canvas.remove();a.remove()} img.src = "data:image/svg+xml,"+encodeURIComponent(svg); } convertPng(new QRCode({ content: "http://github.com/", padding: 4, width: 256, height: 256, color: "#000000", background: "#ffffff", ecl: "M", }).svg(),256,'Test.png') |
function convertPng(svg,size,name){ let canvas = document.createElement("canvas");canvas.width=size;canvas.height=size; let img = new Image();img.width=size;img.height=size; let a = document.createElement("a");a.download=name; img.onload = function() {canvas.getContext('2d').drawImage(img, 0, 0);a.href=canvas.toDataURL("image/png");a.click();img.remove();canvas.remove();a.remove()} img.src = "data:image/svg+xml,"+encodeURIComponent(svg); } convertPng(new QRCode({ content: "http://github.com/", padding: 4, width: 256, height: 256, color: "#000000", background: "#ffffff", ecl: "M", }).svg(),256,'Test.png')
Библиотека когда-то отсюда взята: https://github.com/papnkukn/qrcode-svg
Ответы:
Вы даже не потрудились загуглить пример? Вот надо динамически создать тег a с нужными атрибутами, кликнуть по нему и удалить.
Обновлено.
И снова я за вас погуглил )) Вот так можно сгенерировать налету и скачать как картинку.
https://codepen.io/yarkovaleksei/pen/OJGOzww?edito...
- Прошу прощения, но вы видимо не потрудились прочитать мой вопрос в том числе :)
У меня нет ссылки изначально на файл, я и уточнил, что проблема в преобразовании строки в qr-код с ссылкой на образовавшийся файл. download тут в самом конце юзается, и я прекрасно знаю о нём и динамическом создании элементов.
Для генерации можете использовать этот QR Code Generator (Я его не пробовал, по этому не знаю что там к чему).
Для UI по QR кодам можете использовать QRCode от Ant Design
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для создания QR-кода по строке и направления его пользователю на скачивание, вы можете использовать библиотеку PHP QR Code. Вот пример кода, который поможет вам сделать это:
// Подключаем библиотеку PHP QR Code require_once 'phpqrcode/qrlib.php'; // Строка, которую вы хотите закодировать в QR-код $data = 'Ваш текст или ссылка здесь'; // Путь к файлу, в который будет сохранен QR-код $filename = 'qrcode.png'; // Размер и качество QR-кода $size = 10; $level = 'H'; // Создаем QR-код QRcode::png($data, $filename, $level, $size); // Отправляем заголовок для скачивания файла header('Content-Type: application/octet-stream'); header('Content-Disposition: attachment; filename="' . basename($filename) . '"'); header('Content-Length: ' . filesize($filename)); // Открываем файл для чтения и передаем его содержимое пользователю readfile($filename); // Удаляем файл после передачи unlink($filename);
Этот код создаст QR-код по заданной строке, сохранит его в файле "qrcode.png" и направит его пользователю на скачивание. Пользователь получит файл с QR-кодом, который он сможет отсканировать с помощью мобильного устройства. Не забудьте, что для работы этого кода вам потребуется библиотека PHP QR Code, которую вы можете скачать с официального сайта.