штрих код в html

PHP штрих код

Здравствуйте, уважаемые читатели блога LifeExample, недавно передо мной встала задача «как в php штрих код генерацию сделать?«, то есть по введенному артикулу продукта генерировать штрих код (barcode) и вывести его на страницу для дальнейшей печати.

Нет такого человека на сегодняшний день, кто бы ни разу не встретил штрих код в повседневной жизни, ведь все мы ежедневно совершаем покупки в супермаркетах. Если посмотреть внимательно,то на всех этикетках и упаковках в магазинах имеется место, на котором напечатан набор черных полосок разной ширины, разделенных белым пространством, так вот данный набор и называется штрих код.

Существует большая разновидность штрих кодов:

Штриховой код Codabar

Штриховой код «2 of 5»

Штриховой код 39

Штриховые коды UPC и EAN

Стековый код PDF417

Матричный код Data Matrix

Для генерации этих и других видов штрих кода придумано немало алгоритмов кодирования:

EAN-8, EAN-12, EAN-13, UPC, ISBN, Code39, Code128, Code128B, Code128B, RAWCode128, Interleaved25, CBR, MSI, PLS and Code93

Существует и разнообразие среди библиотек по работе с штрих кодами в php, но я хочу предложить один наиболее простой способ генерации в php штрих кода — без подключения библиотек.

Генерировать штрих код мы будем по алгоритму Code39

Наименование данного кода связано со структурой изображения букв «3 из 9», где три элемента буквы (два штриха и один пробел) из девяти являются широкими, а остальные шесть — узкими. Каждая буква кода 39 представлена пятью штрихами и четырьмя пробелами.

По сравнению с кодом 2 of 5 число вариантов изображения буква увеличивается в четыре раза и позволяет отобразить 40 различных букв. Предусмотрены четыре дополнительных знака ($, «, +, %). Код 39 является дискретным, контролируемым. Достоинством этого кода является его очень высокая надежность, которая может быть увеличена добавлением в символ контрольной буквы.

Как генерировать в PHP штрих код Code39

В классе присутствует ассоциативный массив соответствий символов и последовательностей штрихов для них. Например, если мы захотим закодировать слово «PHP» то получим такую последовательность:

bwbbbwbbbwbwwwbw bbbwbwbwwwbbbwbw bwbbbwbbbwbwwwbw

Три входящих символа (‘P’,’H’,’P’) равны трем последовательностям. Пробелы между ними я проставил для наглядности.

Полученная последовательность преобразуется в штрих код для слова PHP

Вот так выглядит приведенный выше штрих код на самом деле:

Плюсы данного подхода в том, что после распечатывания наклеек с штрих кодами мы получим наиболее четкие линии чем при печати сгенерированной картинки.

Как генерируется штрих код code39 мы выяснили, осталось лишь сделать красивую верстку для удобного распечатывания и последующей нарезки наклеек.

Источник

Как вывести штрих-код на сайте

Чтобы вывести штрих-код на сайте или при печати достаточно подключить специальный шрифт. Но среди большого количества нужно выбрать именно тот шрифт, который успешно будет считываться сканером штрих-кода.

Среди них есть три основных основных стандарта:

Code 39

Code 39 (также известный как «USS Code 39», «Code 3/9», «Code 3 of 9», «USD-3», «Alpha39») – штрих-код, которым можно закодировать латинские буквы, цифры и некоторые специальные символы.

Шрифт «C39HrP24DhTt»

Авторские права: Copyright 1988-93, Bear Rock Technologies Corp.
Торговой марка: Font Monster v3.1

Шрифт Libre Barcode 39

Авторские права: Copyright 2015 The Libre Barcode Project Authors (lasse@graphicore.de)
Лицензия: Open Font License.

Code 128

Цифровой код в формате Code 128 компактнее за счёт «двойной упаковки» данных, когда две цифры записываются в один шаблон штрихкода. Буквенные символы кодируются обычным способом.

В штрих-код Code 128 можно закодировать до 70 символов:

Шрифт «Code-128»

Авторские права: Grandzebu. 2003. All Rights Reserved
Лицензия: Public domain / GPL / OFL

Шрифт «Libre Barcode 128»

Авторские права: Copyright 2015 The Libre Barcode Project Authors (lasse@graphicore.de)
Лицензия: Open Font License

European Article Number (европейский номер товара), самый распространенный формат, предназначенный для кодирования идентификатора товара и производителя. Имеет несколько модификаций:

Источник

Бесплатно Создать Штрихкоды Онлайн

Линейные Штрихкоды, 2D Коды, GS1 DataBar, Почтовые Штрихкоды и многие другие!

Этот веб-сервис не хранит данные пользователя. Данные входа обрабатываются только провайдером входа. Пожалуйста, ознакомьтесь с нашими условиями использования и политикой конфиденциальности.

Ваши преимущества

Для зарегистрированных пользователей в ближайшее время будут добавлены новые расширенные функции.

Спасибо за Ваш интерес! Для получения дополнительной информации, пожалуйста, свяжитесь с нами!

Scan-IT to Office

Приложение Scan-IT to Office (для Android, iOS) отправляет удаленно собранные данные и штрихкоды в реальном времени в Excel, Word, Google Таблицы, базы данных или любые другие приложения для ПК или Mac.

Онлайн генератор этикеток

Создавайте этикетки со штрих-кодом и отраслевые этикетки и формы этикетки VDA 4902, AIAG, MAT и т.д. Попробуйте бесплатную демо-версию Онлайн-генератора этикеток со штрихкодом для моментальной печати нужных Вам этикеток.

Онлайн-генератор QR-кодов

Используйте созданные QR-коды для перехода на веб-страницы, ввода телефонных номеров, сообщений, отправки твитов, передачи контактных данных, подключения к Wi-Fi сетям и т.д. Просто попробуйте!

Данный генератор штрихкодов является бесплатным

Вы можете использовать данный генератор штрих-кодов как часть Вашего некоммерческого веб-приложения или веб-сайта для создания динамических штрих-кодов с Вашими собственными данными. В ответ мы просим Вас разместить на Вашем сайте обратную ссылку с текстом «Генератор штрихкодов от TEC-IT». Использование логотипов TEC-IT опционально. Пожалуйста, свяжитесь с нами, если Вы хотите использовать данный сервис в коммерческих целях.

Для размещения обратной ссылки используйте подготовленный HTML-код.

Источник

Мой штрихкод. Code128

Однажды в процессе производственной деятельности у меня появилась необходимость генерации штрихкода по стандарту code128. Появилась в виду того, что имевшаяся в эксплуатации функция (хранимая процедура в базе Oracle) генерировала клёвый, полосатый штрихкод, который читался не во всех случаях. Разработчики в своё время оттестировали эту процедуру весьма некачественно, но перерабатывать уже не собирались т.к. проект был давно сдан, а потребности в считывании так и не появились.

Первая мысль — поиск готовых библиотек. Навскидку определили критерии — с pl/sql не связываемся, пусть это будет внешний сервис: возможно кусок на javascript для генерации прямо на страничке, либо обращение за картинкой к ближайшему серверу где имеется php. Беглый поиск в интернете показал что тема истоптана весьма плотно. Есть как наколенные поделки уровня лабораторки по программированию, так и мощные библиотеки для всех вариантов кодирования вплоть до qr-кодов. Варианты с JavaScript пришлось отбросить т.к. они во-первых практически все «обфусканы» (даже непонятно, то ли для сокращения объема, то ли стыдно исходники показать), во-вторых генерируют строку для отображения определенным шрифтом, наличие которого не всегда можно обеспечить на клиентском месте и требует дополнительных обработок для экранирования спецсимволов. Внимательное изучение библиотек и кусков кода на php тоже произвело тягостное впечатление — на первый взгляд всё вроде бы правильно: и классы написаны на все случаи жизни, комментарии в наличии, украшательства типа выбора цвета и рамочек, примеры подготовлены. Начнёшь вникать — хотят либо php самой распоследней версии (на боевых серверах не всегда это получается добыть), либо внутренняя логика не различима совсем, либо штрихкод на выходе получается длиннее ожидаемого. Вот последнее не дало покоя и подтолкнуло к собственной реализации.

Самое время пощупать теорию. Вернее мы с ней познакомились намного раньше, просто до последнего не хотелось ввязываться в дополнительное программирование. Исторические факты опустим, а вот очень хорошее техническое описание имеется на http://code128.narod.ru/ (в архиве это файл Descript.doc ) либо в Википедии. В принципе, это всё что нам потребуется для понимания и собственной реализации алгоритма (тут я немного лукавлю — из любой готовой библиотеки нужно выдрать таблицы толщин штрихов, чтобы не вбивать их вручную). Ну и напишем всё это безобразие на php, заодно посмотрим пару прикольных моментов, про которые все забывают или стесняются использовать.

Теория гласит, что code128 позволяет закодировать (сюрпрайз!) 128 символов, при этом нам доступно 3 алфавита, между которыми можно переключаться по ходу дела. Наибольший практический интерес представляют алфавит «B» для буквенно-цифровых символов и алфавит «С» который используется для кодирования цифр, но с некоторой оптимизацией — одним штриховым символом можно закодировать 2 исходных символа и получить более короткий штрихкод. Вот эта оптимизация пока не даётся ни одному php-разработчику — максимум что я видел это попытка в начале кодирования определить состав строки и при наличии только цифр переключаться на алфавит «С». В остальных библиотеках это банальная подстановка символов штрихкода по таблице.

Сразу набросаем простейший класс который содержит сам текст, такие-же классы для рассмотрения вариантов по алфавиту B и С, длину последовательности. Делаем ему минимальный конструктор — на входе строка для кодирования, режим кодирования, ссылки на потомков. В начале конструктора добавляем проверки, чтобы не прорабатывать данную ветку дерева:

и сразу ловим конкретный косяк — куча «пустых» объектов. И это не смотря на то что мы явно отказались создаваться и вроде как железно возвращаем NULL! В общем сразу надо понять, что в php объект создаётся в любом случае. Полагаю что также и в остальных объектно-ориентированных языках. И все эти условия надо проверять перед созданием объекта. Следовательно правильный конструктор будет выглядеть примерно так:

Итак, худо-бедно мы нашли самый короткий путь (штрихкод). Надо его вывести для начала на экран. Делаем в два этапа: сначала от потомка возвращаемся к родителю. Итоговые символы, включая переключение между алфавитами, пушим (push) в массив. Да, в PHP есть такая функция, и она позволяет нам сделать из массива довольно удобный стэк.

Когда потребуется вывести строку — используем array_pop. Таким образом, мы по прежнему используем данный массив как стэк и легко выводим информацию в обратном порядке. Попутно готовим дополнительную обвязку для нашего штрихкода — старт/стоп/контрольная сумма.

Как этим пользоваться? В файл с классом в конец добавим пару строк:

попробовать можно сразу, вставив в html-страничку примерно вот такой тэг:

Источник

Обзор JavaScript-сканнеров штрихкодов

Недавно появилась идея сэкономить на ТСД на складе и попробовать использовать вместо них обычные дешёвые мобильники (даже без пылезащиты). Интерфейс планирую реализовать в виде веб-приложения (обычные веб-странички, HTML + CSS + JS).

Для того, чтобы всё получилось, необходимо научить веб-странички сканировать штрихкода через камеру телефона. Получить данные с камеры достаточно просто. Основная работа состоит в обработке кадра. Под катом обзор существующих готовых решений и много картинок.

quaggaJS

На сайте проекта присутствует страничка, где можно загрузить образцы и попробовать библиотеку в деле. Пробуем образец №1. Необходимо указать некоторые настройки, ок, не вопрос.

В результате запуска определить штрихкод не удалось, но расположение штрихкода определено неплохо.

Пробуем образец №2. Как-то безрадостно.

Возможно он лучше работает с картинками высокого разрешения. Хорошо, делаем третий образец (образец №3).

Честно говоря я не знаю какой это тип штрихкода и попробовал все настройки — ШК не определился. Хорошо, давайте попробуем ещё один образец высокого разрешения (образец №4):

Почему-то ни с какими настройками результата добиться не удалось.

Попробуем «чистый» образец от следующей библиотеки (образец №5):

javascript-barcode-reader

Или можно скачать всего один файлик: javascript-barcode-reader.min.js размером 10 445 байт.

У проекта есть страничка с примерами, однако картинки получены путём генерации кодов, а не с камеры. Нам такое не пойдёт.

Образец №1. Библиотека выдаёт в консоль «Error: Failed to extract barcode!».
Образец №2. Библиотека выдаёт в консоль «Error: Failed to extract barcode!».
Образец №3. Библиотека выдаёт в консоль «Error: Failed to extract barcode!».
Образец №4. Библиотека выдаёт в консоль «601».

Хмм… может библиотека подключена неправильно? Попробуем вот такой образец:

Образец №5. Библиотека выдаёт в консоль «10023». Прикольно.

Dynamsoft Barcode Reader

Сайт проекта
Ядро библиотеки написано на WebAssembly (WASM) и только обёртки на JavaScript, что не так интересно. Знает форматы:

1D: Code 39, Code 93, Code 128, Codabar, EAN-8, EAN-13, UPC-A, UPC-E, Interleaved 2 of 5 (ITF), Industrial 2 of 5 (Code 2 of 5 Industry, Standard 2 of 5, Code 2 of 5), ITF-14;

2D: PDF417, QR Code, DataMatrix, Aztec.

Это платная библиотека, доступна по подписке, все типы штрихкодов стоят 2199$ в год, если только одномерные коды, то стоимость уменьшается до 1099$ в год. Есть страничка1 и страничка2 для экспериментов.

Образец №1. Да! Ответ правильный. Область обведена достаточно чётко.

Образец №2. Да. Ответ снова правильный. Область тоже обведена достаточно чётко.

Образец №3. Теперь мы знаем тип этого штрихкода.

Образец №4. Ответ тоже верный.

А ещё, судя по всему, можно вот так:

Однако первый образец распознан с ошибкой. И попробуем ещё вот так (оригинал картинки очень размыт):

Теперь мы знаем, что существует хотя бы одна работающая библиотека, хоть и платная.

tobytailor get_barcode_from_image.js

Пробуем первый образец:

Результат: 000204892734. Образец распознан.

Берём образец №2 (EAN-13). Только чтоб заработало, необходимо строку 32 скрипта написать так:

Результат: XXXXXXXXXXXX. Образец не распознан.

Результат: XXXXXXXXXXXX. Не распознан.

Давайте попробуем что-то простое:

Результат: не распознан. Возможно ему нужно подавать так, чтобы кроме штрихкода на картинке ничего не было, исключая и лишнее пространство.

EddieLa BarcodeReader

If you like and/or use this project for commercial purposes consider donating to support my work.

Если вам нравится и/или вы используете этот проект в коммерческих целях, рассмотрите возможность пожертвования для поддержки моей работы.

Знает форматы: Code128, Code93, Code39, Standard/Industrial 2 of 5, Interleaved 2 of 5, Codabar and EAN-13. Имеет страницу для экспериментов.

Образец №1. Область и тип определены верно. Код распознался с ошибкой.

Образец №2. Хороший результат. Правильно распознаны: область, тип штрихкода и сам штрихкод.

Образец №3. Отрицательно. Под углом не умеет.

Образец №4. Очень хорошо, образец распознан.

Образец №5. Образец распознан.

Ну что ж, похвально. Последние изменения в библиотеке произошли 3 года назад.

WebCodeCamJS

Образец №1: Не распознан.

Образец №2: Распознан правильно.

Образец №3: Не распознан.
Образец №4: Не распознан.
Образец №5: Распознан правильно.

Возможность распознавать QR-коды представляется интересной, поэтому мной было собрано 6 образцов для тестирования этой и последующих библиотек:

Образец №1: ничего.
Образец №2: Ничего.
Образец №3: Ничего.
Образец №4: Ничего.
Образец №5: Ничего.
Образец №6: Распознан.

Web QR

Страница проекта
Бесплатная библиотека. Заявлена генерация и распознавание QR-кодов. На странице проекта есть возможность попробовать библиотеку.

Ни один из шести образцов не был распознан. На странице есть генератор QR-кодов, вот полученные с помощью этого генератора коды распознаются.

UPD. Совместными усилиями в комментариях (спасибо TiesP ) удалось установить, что алгоритм работает, просто не умеет определять ориентацию кода. С учётом этого новые результаты такие:
Образец №1 — не распознан.
Образец №2 — не распознан.
Образец №3 — не распознан.
Образец №4 — не распознан.
Образец №5 — распознан.
Образец №6 — распознан.

Видимо есть ещё какие-то ограничения к фону, так как на бумаге определился и мой образец и образец, предоставленный в комментариях:

Это всё что я нашёл. Находил несколько реализаций, основанных на одной из вышеприведённых, например вот эта. Повторю, что основной критерий поиска — это вся работа должна выполняться на клиентской стороне через браузер и без дополнительной установки чего либо. То есть решение должно быть реализовано на JavaScript и/или Wasm (поэтому ZBar не подходит).

Если вам известна библиотека, отвечающая данным требованиям, и отсутствующая в статье — просьба сообщить.

Полученный рейтинг библиотек таков:

Статья состоялась благодаря интернет-магазину освещения Дивайн Лайт.

Источник