Laravel 8 Optical Character Recognition using Google Cloud Vision

16877 views 1 year ago Laravel

Google cloud vision is image OCR to get json details from the images. It helps to detect objects and faces, texts, and build valuable image with Google Cloud Vision.

In this article we will see how you can add Google Cloud Vision in your Laravel application and get text, object details from the images. Follow the below steps to implement in your application.

1 Create Google Cloud console account

Before you start working on Laravel, first create an account to Google and Go to create or manage project. Make sure you have enabled Cloud Vision API to your Google Console.

Get your Google key from the credentials menu.

2. Laravel setup

First open the CMD or Terminal to your computer and create a fresh Laravel application using below command.

composer create-project laravel/laravel imageocr

When your Laravel is setup, in .env file add the below line with Google key.

GOOGLE_CLOUD_KEY= your api key

Now install the Google's cloud vision package for PHP.

composer require google/cloud-vision

3. Create routes and Controller

First create routes in routes/web.php file.

<?php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\GoogleOCRController;

Route::get('google-ocr', [GoogleOCRController::class, 'index'])->name('index');
Route::post('google-ocr', [GoogleOCRController::class, 'submit'])->name('submit');

Create controller file to handle routes.

php artisan make:controller GoogleOCRController

Open the app/Http/Controller/GoogleOCRController.php file and add these two methods.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Google\Cloud\Vision\V1\Feature\Type;
use Google\Cloud\Vision\V1\ImageAnnotatorClient;
use Google\Cloud\Vision\V1\Likelihood;

class GoogleOCRController extends Controller
{
    /**
     * open the view.
     *
     * @param 
     * @return void
     */
    public function index()
    {
        return view('googleOcr');
    }

    /**
     * handle the image
     *
     * @param 
     * @return void
     */
    public function submit(Request $request)
    {
        if($request->file('image')) {

            // convert to base64
            $image = base64_encode(file_get_contents($request->file('image')));

            $client = new ImageAnnotatorClient();
            $client->setImage($image);
            $client->setFeature("TEXT_DETECTION");

            $google_request = new GoogleCloudVision([$client],  env('GOOGLE_CLOUD_KEY'));

            $response = $google_request->annotate();

            dd($response);
        }
    }
}

4. Create resource/views/googleOcr.blade.php blade file for upload image.

<!DOCTYPE html>
<html>
    <head>
        <title>Google Cloud Vision OCR</title>
        <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    </head>
    <body>
        <div class="container">
            <div class="row mt-3">
                <form method="post" action="{{ route('submit') }}" enctype="multipart/form-data">
                    @csrf
                    <div class="mb-3">
                        <label for="image" class="form-label">Select image:</label>
                        <input type="file" id="image" name="image" class="form-control">
                    </div>
                    <button type="submit" class="btn btn btn-primary">Submit</button>
                </form>
            </div>
        </div>
    </body>
</html>

Now run the Laravel server

php artisan serve

And go to the http://localhost:8000/google-ocr in your web browser. Upload the image and you will get the image deails response in json format.

Thank you for giving time to read the article.

Author : Harsukh Makwana

Hi, My name is Harsukh Makwana. i have been work with many programming language like php, python, javascript, node, react, anguler, etc.. since last 5 year. if you have any issue or want me hire then contact me on [email protected]