asked on

Generate barcode and store image in cache

I am looking for a way to generate a barcode on a PWA (progressive web application) from a text string, display the barcode on the screen and also store it to a local storage via a service worker.

I can create the barcode using this excellent barcode script

[url="http://davidscotttufts.com/2009/03/31/how-to-create-barcodes-in-php/"]

However, when I try to save it as an image to store locally, I cannot seem to be able to do it. Possibly because I cannot give the generated barcode image a "name".

My code is...

<?php
$cardno='12345678';
echo "<h3 style='text-align:center'>Your Card Number is ".$cardno."</h3>";
echo "<div style='margin-top:30px; margin-right:auto; margin-left:auto; width:280px; margin-bottom:20px'>";
echo "<img alt='".$cardno."' src='barcode.php?filepath=images&text=".$cardno."&size=25' style='width:280px'/></div>";
?>

Open in new window

Any advice would be appreciated

David Favor

Easy way is to use https://www.idautomation.com/barcode-fonts/ purchased fonts.

Then just follow the provided docs for generating fonts.

If you do this as a font, rather than rendering an image, barcodes scale to any size without artifacts, so are scannable in all sizes.

If you generate an image, any image rescaling will pixelate the barcode bars + scanning will no longer be possible.

Use the font approach + you can produce a scannable barcode, of any size.

Scott Fell

> when I try to save it as an image to store locally, I cannot seem to be able to do it.

How are you trying to save this?

Scott Fell

If you want to store in local storage, you just need to save the code used to generate the image. This could be base64 code or the raw text that the barcode represents. Keep in mind that saving to local storage means you don't want to save anything that should be private. Saving to local storage is done via javascript. That means it will be rendered by javascript as well. https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Local_storage

Scott Fell

As an alternative to using a font as David suggests, you can also look to using a javascript library such as https://github.com/lindell/JsBarcode Where saving or displaying using php comes into play may be to hide, obfuscate or perform actions such as saving or retrieving on the server which are you are not doing.

ASKER CERTIFIED SOLUTION

Chris Harte

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

David Favor

Tip: Buy a cheap barcode scanner off Amazon + scan barcodes you generate right off the screen.

This can save a massive amount of money, if you're printing barcodes onto some box or embedding in 1,000,000s of labels you have printed.

Tip: Your barcode is only useful, if you can truly scan it with a scanner + get an exact match output of the barcode you think you're generating.

Scott Fell

Chris, that works, but I think rwlloyd71 is wanting to save to local storage. So it has to be text on the client side.

Richard Lloyd

ASKER

Thanks for all your comments - all are very much appreciated.

I am embarrassed to say that Chris Harte is correct and the simple line of code did the trick. I had already tried that, but it did not work originally, maybe something to do with file permissions.

Richard Lloyd

ASKER

Thank you to all.

Richard Lloyd

ASKER

PS. I have posted a follow-up question on how to handle the dynamic file name in the service worker javascript

https://www.experts-exchange.com/questions/29131867/Pass-Dynamic-PHP-variable-to-external-JavaScript-file-for-PWA-local-cache.html