Laravel 10 Generate QR Code Tutorial with Example

To generate QR codes in a Laravel application, you can use the “simple-qrcode” package to generate QR codes easily. Here’s a step-by-step guide to generating QR codes in Laravel 10.

Using the simple-qrcode we can generate different types of QR Codes in the Laravel app. Here we have implemented Laravel simple QR codes with text, size, color, background color, formats like png, eps, svg in laravel or php.

How to Generate QR Codes in Laravel 10

Follow the following steps for generating QR code in Laravel application.

  • Step 1: Install Laravel 9 App
  • Step 2: Connect App to Database
  • Step 3: Install simple-QRcode Package
  • Step 4: Configure Simple QR Code Package
  • Step 5: Add Routes
  • Step 6: Create Blade File
  • Step 7: Run Development Server

Download Laravel App

First of all, open the terminal and execute the following command on the terminal to install or download Laravel 9 app:

composer create-project --prefer-dist laravel/laravel laravel-qr-code

Go into the app:

cd laravel-qr-code

Connect App to Database

In this step, open .env and configure database details for connecting app to database:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=database_name
DB_USERNAME=database_user_name
DB_PASSWORD=database_password

Configure qrcode Package in Laravel

Start by installing the “Simple QrCode” package using Composer. Open your terminal and navigate to your Laravel project’s root directory, then run the following command.

composer require simplesoftwareio/simple-qrcode

Update config/app.php file with below service provider and aliase.

'providers' => [
	....
	SimpleSoftwareIO\QrCode\QrCodeServiceProvider::class
],

'aliases' => [
	....
	'QrCode' => SimpleSoftwareIO\QrCode\Facades\QrCode::class
],

Make Routes

Open the routes/web.php file and add the following route definition for generating the QR code.

use App\Http\Controllers\QrCodeController;

Route::get('generate-qr', 'QrCodeController@generate');

Create Controller

Create a new controller file, such as QRCodeController.php, in the app/Http/Controllers directory. Open the file and add the following code:

php artisan make:controller QrCodeController

Next, head over to app/http/Controllers/QrCodeController.php and add the provided code.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
class QrCodeController extends Controller
{
    public function generate() 
    {
        \QrCode::size(500)
                ->format('png')
                ->generate('codingdriver.com', public_path('images/qrcode.png'));
        
        return view('qr-code');
    }
}

Create Blade file

In last step create a blade where you want to show the qr code image in your laravel project.

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
    
<div class="visible-print text-center">
	<h1> Laravel QR Code Generator Example </h1>
     
    {!! QrCode::size(250)->generate('codingdriver.com'); !!}
</div>
    
</body>
</html>

Run Development Server

Now, execute the following command on the terminal to start the development server:

php artisan serve

Now open your browser and put this URL;

http://127.0.0.1:8000/generate-qrcode

You have now successfully generated and displayed a QR code in Laravel using the “Simple QrCode” package. Feel free to customize the QR code generation process according to your specific requirements.

Note: If you hit the URL you will get “You need to install the imagick extension to use this back end” error, so now you need to install imagick in your system. If you are using Windows then you need to add the php_imagick.dill package inside the php ext.

Uses of QR Codes in Laravel

You can use the Laravel Simple QR code in different style, fonts, download options, phone numbers, email etc:

QR Code with Color

You can change the color of QR code by just adding the below code in the generate method in your controller.

public function generate() 
{
    \QrCode::size(500)
            ->format('png')
            ->backgroundColor(255,55,0)
            ->generate('codingdriver.com', public_path('images/qrcode.png'));
    
    return view('qr-code');
}

QR Code with Email

public function generate() 
{
    \QrCode::size(500)
            ->email('admin@example.com', 'Welcome to Coding driver!.')
            ->generate('codingdriver.com', public_path('images/qrcode.png'));
    
    return view('qr-code');
}

QR Code with Phone Image

public function generate() 
{
    \QrCode::size(500)
            ->merge('images/laravel.png', 0.5, true)
            ->generate('codingdriver.com', public_path('images/qrcode.png'));
    
    return view('qr-code');
}

QR code with Phone Number

QrCode::phoneNumber('111-222-6666');

QR code with Text Message

QrCode::SMS('9898989898', 'Your message is here');

Download QR Code in PNG, SVG, EPS

If you need to download the qr code in png, svg, eps then you need to update some tips here:

First Create a route for download the qr code.

routes\web.php

Route::post('download-qr-code/{type}', 'QRController@downloadQRCode')->name('qrcode.download');

Now update your blade file just like below

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>

<div class="visible-print text-center">
	<h1> Laravel QR Code Generator Example </h1>

		<img src="data:image/png;base64, {!! base64_encode(QrCode::format('png')->errorCorrection('H')->size(200)->generate('codingdriver.com')) !!}" /><br>
		<ul class="d-flex p-0 justify-content-center" style="list-style:none;">
			<li>
				<form class="form-horizontal" action="{{ route('qrcode.download', [ 'type' => 'png' ])}}" method="post">
					@csrf
					<button type="submit" class="align-middle btn btn-outline-primary btn-sm">
						<i class="fas fa-fw fa-download"></i>
						PNG
					</button>
				</form>
			</li>
			<li>
				<form class="form-horizontal" action="{{ route('qrcode.download', [ 'type' => 'svg' ])}}" method="post">
					@csrf
					<button type="submit" class="align-middle btn btn-outline-primary btn-sm ml-1">
						<i class="fas fa-fw fa-download"></i>
						SVG
					</button>
				</form>
			</li>
			<li>
				<form class="form-horizontal" action="{{ route('qrcode.download',[ 'type' => 'eps' ])}}" method="post">
					@csrf
					<button type="submit" class="align-middle btn btn-outline-primary btn-sm ml-1">
						<i class="fas fa-fw fa-download"></i>
						EPS
					</button>
				</form>
			</li>
		</ul>
</div>

</body>
</html>

Here you need to update your controller with the qrcode download functionality ..

  public function downloadQRCode(Request $request, $type)
  {
         $headers    = array('Content-Type' => ['png','svg','eps']);
         $type       = $type == 'jpg' ? 'png' : $type;
         $image      = \QrCode::format($type)
                      ->size(200)->errorCorrection('H')
                      ->generate('codingdriver');

         $imageName = 'qr-code';
         if ($type == 'svg') {
             $svgTemplate = new \SimpleXMLElement($image);
             $svgTemplate->registerXPathNamespace('svg', 'http://www.w3.org/2000/svg');
             $svgTemplate->rect->addAttribute('fill-opacity', 0);
             $image = $svgTemplate->asXML();
         }

         \Storage::disk('public')->put($imageName, $image);

         return response()->download('storage/'.$imageName, $imageName.'.'.$type, $headers);
  }

Simple QrCode Download in Jpg or Transparent Background

If you want to download the qr code in jpg please reade the below article.

See Here: simplesoftwareio/simple-qrcode Download in JPG or Transparent Background

So the Laravel QR Code Generator successfully install and configure in Laravel application. If you have any questions comment below.

7 thoughts on “Laravel 10 Generate QR Code Tutorial with Example”

    • Hi, Dear same as here we have already describe. If want more you can explain a little more so we can do for you. Thanks

      Reply
  1. hi sir, i am new to laravel,What is the supposed output?
    when i followed the steps, it just only print the heading and a line
    ” {!! QrCode::size(250)->generate(‘codingdriver.com’); !!} “

    Reply

Leave a Comment