Ответ 1
Script Вы опубликовали WORKING, sample.html не обрабатывается как HTML.
В настоящее время я ищу библиотеку js, которая может кодировать текст в qr-кодах. Единственный, который я смог найти до сих пор, кажется сломанным, хотя другие люди утверждают, что используют его. Страница примера не работает. Играя немного с этим, мне удалось генерировать коды, но они не декодируются программным обеспечением телефона.
Есть ли другая библиотека для js? Кто-нибудь сумел заставить его работать?
Меня не интересует решение, которое извлекает код из онлайн-сервиса (kaywa, google и т.д.).
Update:
Ну, ребята, вы правы, эта библиотека работает. Моя проблема заключалась в том, что я попытался включить его на странице Boilerplate HTML5, и document.write, похоже, не работает в этом. В любом случае я модифицировал образец кода, чтобы сделать рисунок браузера в холсте не таблицей, и я получил порядок функции fillRect назад. Ниже приведен исправленный вызов функции.
context.fillRect(c * UNIT_SIZE, r * UNIT_SIZE, UNIT_SIZE, UNIT_SIZE);
// it column-row, not row-column; don't ask why :)
Так как я больше не переношу свое изображение:), теперь qr декодирует отлично. Спасибо за поддержку.
Script Вы опубликовали WORKING, sample.html не обрабатывается как HTML.
Я написал простой кодер GPLv3 qr на javascript, который является локальным, использует HTML5 и действительно быстр, поскольку это порт встроенной версии C, которую я написал для процессоров Atmel AVR.
http://code.google.com/p/jsqrencode/downloads/list
На веб-сайте http://zdez.org/qrenc3.html имеется живая версия (которую можно сохранить в виде веб-приложения на устройствах iOS) (сохранить на дом, открыть в Safari, чтобы можно было скопировать изображение или использовать airprint).
Вот ссылка на загружаемый исходный код.
Существует простая библиотека JavaScript, которую я когда-то нашел под названием QRCode.js.
QRCode.js - это кросс-браузерная библиотека JavaScript, которая позволяет генерировать QRCodes "на лету" на стороне клиента. QRCode.js использует холст и таблицы HTMl5 для отображения QRCode. Сама библиотека не имеет никаких зависимостей.
Чтобы создать QRCode, вам просто нужно включить библиотеку JavaScript, а затем передать в качестве параметров функцию QRCode, текст, который вы хотите кодировать как QRCode, ширину и высоту QRCode, который вы хотите отобразить, а также как ваш заданный цвет переднего плана и цвет фона.
Я нашел рабочий генератор qrcode, основанный на javascript-jquery, который вам может быть интересен. Его openource и он действительно работает. Вот ссылка: https://github.com/jeromeetienne/jquery-qrcode
Хорошая вещь об этом заключается в том, что ее легкий вес и не вызывает никакой удаленной службы или веб-сайта.
QR-код в исходном сообщении поддерживает только до 271 байт (версия 10, размер = 57x57, уровень L уровня).
Чтобы он поддерживал полные спецификации QR-кода (версии 40, 177x177, 2953 байта), вам нужно добавить больше значений в свой RS_BLOCK_TABLE.
Смотрите оставшиеся матрицы (версия 11-40) здесь: http://two.pairlist.net/pipermail/reportlab-users/2010-September/009707.html
Я использую QR-код ShieldUI Lite, который можно найти здесь:
https://github.com/shieldui/shieldui-lite
Содержит все версии QR-кода, все уровни ошибок.
Существует также новый kjua от того же автора, что и "старый" jQuery.qrcode.
И QR-код-генератор @nayuki также имеет возможность создавать QR-коды в виде SVG.
npm имеет несколько. Я понятия не имею, какие из них хороши.
$ npm search qrcode
npm http GET https://registry.npmjs.org/-/all/since?stale=update_after&startkey=1379059929305
npm http 200 https://registry.npmjs.org/-/all/since?stale=update_after&startkey=1379059929305
NAME DESCRIPTION A
jsqrcode a node port of Lazar Laszlo `jsqrcode` qr code decoder =
jsqrcode-lite Simplified version of Lazar Laszlo `jsqrcode` for node. =
node-zxing ZXing Wrapper =
qr A small library to generate QR codes with libqrencode. =
qr-element qrcode dom element =
qr.js qrcode encoding in javascript =
qrcode QRCode / 2d Barcode api with both server side and client side s
qrcode-emitter Emits QR codes found in an image stream. =
qrcode-npm QRCode Generator for JavaScript =
qrcode-terminal QRCodes, in the terminal =
qrcode.js QR Code Detection / Decoding / Generation =
qread QRcode detector & decoder =
qruri NodeJS port of Kang Seonghoon qr.js =
rescode Generate Codes (EAN13, QRCODE ..) =
zbar node-zbar is a NodeJS binding to the ZBar QR Code library.
Я не мог найти генератор qr-кода javascript.
Но вы могли бы рассмотреть использование Google API:
http://code.google.com/apis/chart/docs/gallery/qr_codes.html http://togosoft.com/web/qrcode/qrcode.js
Update: Я просто попробовал http://d-project.googlecode.com/svn/trunk/misc/qrcode/js/qrcode.js и мне все равно. Единственное, что я сделал, это увеличить размер и закрыть его правильно, поскольку само закрытие не является правильным html. http://k3rmit.org/nopaste/759 Я протестировал 3 разных строки и использовал приложение под названием QRReader на моем iPhone для декодирования.
Обновление 2:
С var qr = new QRCode(10, QRErrorCorrectLevel.L);
мне удалось установить 271 символ в QRCode, но, возможно, это не самая надежная настройка.
Я знаю, что это старый вопрос, но я думаю, что нет необходимости в библиотеке для создания QR-кода из текста. Вам просто нужно использовать QR-код API.
Реализация очень проста, у нас есть форма с текстовым полем, которая захватывает данные контента. Всякий раз, когда мы нажимаем кнопку "Генерировать", мы генерируем новый URL-адрес запроса к API, который имеет два основных компонента: data
и size
. Первый требует текстового содержимого в кодировке, а второй будет определять размер изображения. Вот код:
let baseURL = 'https://api.qrserver.com/v1/create-qr-code/?data='
let config = '&size=120x120'
let btn, qrCode, content;
function htmlEncode(value) {
return $('<div/>').text(value).html();
}
$(function() {
btn = $('#generate');
qrCode = $('.qr-code');
content = $('#content');
btn.click(function() {
qrCode.attr('src', baseURL + encodeURIComponent(htmlEncode(content.val())) + config);
});
});
.qr-code {
max-width: 160px;
margin: 10px;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container-fluid">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<div class="text-center">
<img src="https://api.qrserver.com/v1/create-qr-code/?data=http%3A%2F%2Fwww.google.com&size=120x120" class="qr-code img-thumbnail img-responsive">
</div>
<div class="form-horizontal">
<div class="form-group">
<label class="control-label col-sm-4" for="content">Enter content:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="content" placeholder="i.e. www.google.com">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="button" class="btn btn-default" id="generate">Generate</button>
</div>
</div>
</div>
</div>
Если вы не можете найти встроенную реализацию JavaScript, вы всегда можете использовать AJAX изображение с вашего сервера.