Welcome To ITSolutionsGuides,
To add a digital signature to a PDF using Laravel and the barryvdh/laravel-dompdf package, first install the package via Composer. Then, generate the PDF file using Laravel DomPDF in your controller or desired location. This typically involves passing the PDF file to the service along with necessary parameters like signature image and signer information, and receiving the signed PDF file as output. Finally, return the signed PDF content as a response to complete the process. By following these steps, you can securely add digital signatures to PDF documents in your Laravel application, enhancing their authenticity and suitability for various purposes. To add a digital signature in PDF using Laravel with barryvdh/laravel-dompdf, utilize signature libraries and DOMPDF for PDF generation.
Lets install new laravel project by using the following artisan command
laravel new project_name
For creating the pdf we are using the barryvdh/laravel-dompdf package for creating the pdf. Lets install the barryvdh/laravel-dompdf package using the help of the composer using the following command.
composer require barryvdh/laravel-dompdfroutes/web.php
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\SignaturePDFController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('signature-pdf', [SignaturePDFController::class, 'index']);
Route::post('signature-pdf', [SignaturePDFController::class, 'upload'])->name('signature.upload');Lets create the controller and the write the function for the image upload ie; uploading the signature , for detailed explanation about Creating Controller
app/Http/Controllers/SignaturePDFController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Barryvdh\DomPDF\Facade\Pdf;
class SignaturePDFController extends Controller
{
/**
* Write code on Method
*
* @return response()
*/
public function index()
{
return view('signaturePDF');
}
/**
* Write code on Method
*
* @return response()
*/
public function upload(Request $request)
{
$data['image'] = $this->uploadSignature($request->signed);
$pdf = Pdf::loadView('signaturePDFView', $data);
return $pdf->download('signature.pdf');
}
/**
* Write code on Method
*
* @return response()
*/
public function uploadSignature($signed)
{
$folderPath = public_path('upload/');
$image_parts = explode(";base64,", $signed);
$image_type_aux = explode("image/", $image_parts[0]);
$image_type = $image_type_aux[1];
$image_base64 = base64_decode($image_parts[1]);
$file = $folderPath . uniqid() . '.'.$image_type;
file_put_contents($file, $image_base64);
return $file;
}
}Create Blade Files
resources/view/signaturePDF.blade.php
<html>
<head>
<title>Laravel Signature Pad Tutorial Example - ItSolutionStuff.com </title>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.1/css/bootstrap.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/south-street/jquery-ui.css" rel="stylesheet">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://keith-wood.name/js/jquery.signature.js"></script>
<link rel="stylesheet" type="text/css" href="http://keith-wood.name/css/jquery.signature.css">
<style>
.kbw-signature { width: 300px; height: 200px;}
#sig canvas{
width: 300px;
height: 200px;
border: 1px solid #a1a1a1;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-10 offset-md-1 mt-5">
<div class="card">
<div class="card-header">
<h5>Laravel Signature Pad Tutorial Example - ItSolutionStuff.com </h5>
</div>
<div class="card-body">
@if ($message = Session::get('success'))
<div class="alert alert-success alert-dismissible">
<button type="button" class="close" data-dismiss="alert">×</button>
<strong>{{ $message }}</strong>
</div>
@endif
<form method="POST" action="{{ route('signature.upload') }}">
@csrf
<p>Welcome,
<br/><br/>
Welcome to the Tutorial
<br/><br/>
Sincerely,
<br/>
ITSolutionsGuides
<br/>
<br/>
Sincerely,
ITSolutionsGuides
</p>
<div class="col-md-12">
<strong>Signature:</strong>
<br/>
<div id="sig" ></div>
<br/>
<button id="clear" class="btn btn-danger btn-sm mt-1">Clear Signature</button>
<textarea id="signature64" name="signed" style="display: none"></textarea>
</div>
<br/>
<div class="col-md-12 text-center">
<button class="btn btn-success">Submit & Download PDF</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
var sig = $('#sig').signature({syncField: '#signature64', syncFormat: 'PNG'});
$('#clear').click(function(e) {
e.preventDefault();
sig.signature('clear');
$("#signature64").val('');
});
</script>
</body>
</html>Create Blade Files
resources/view/signaturePDFView.blade.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<p>Welcome,
<br/><br/>
Welcome to the Tutorial
<br/><br/>
Sincerely,
<br/>
ITSolutionsGuides
<br/>
<br/>
<img src="{{ $image }}" style="border: 1px solid #a1a1a1;">
</p>
</body>
</html>Lets run the laravel project using the following artisan command and then open the url in the browser,
php artisan serve
localhost:8000/signature-pdfWe hope it helps everyone. Thanks for supporting ITSolutionsGuides and keep supporting us also follow us in social media platforms.
Be the first to know about releases and tutorial news and solutions.
We care about your data in our privacy policy.
ITSolutionsGuides was started mainly to provide good and quality web solutions for all the developers. We provide tutorials to support all the developers and also we try to provide solutions to the errors we face while coding.
ITSolutionsGuides, provide users with an easy-to-use form to reach out for support or inquiries.
Copyright © 2023 - 2024 All rights reserved | ITSolutionsGuides