DEV Community

Hilmi Hidayat
Hilmi Hidayat

Posted on • Originally published at divisidev.com on

Implementasi Optical Character Reader(OCR) KTP dengan Identifai Service di Laravel

Laravel OCR KTP - Apa itu OCR KTP? OCR atau Optical Character Recognition merupakan solusi berbasis machine learning untuk membaca data atau informasi karakter pada KTP. OCR banyak sekali diterapkan pada layanan-layanan perbankan atau layanan-layanan yang memang memerlukan informasi pribadi dari KTP pengguna. Saya yakin, di antara kalian pasti pernah menggunakan suatu layanan yang memerlukan kita untuk upload atau foto KTP seperti saat kita hendak mendaftar atau membuka akun Bank digital.

Nah, di artikel ini saya akan membagikan tutorial tentang cara implementasi scan atau membaca data KTP menggunakan OCR service dari Identifai di Laravel.

Install Laravel

laravel new laravel-ocr
Enter fullscreen mode Exit fullscreen mode

Disini hal pertama yang akan saya lakukan adalah dengan memulai install fresh laravel. Pada step ini, saya pikir teman-teman semua pasti sudah paham bagaimana cara menginstall laravel. Install laravel dapat dilakukan dengan berbagai cara, salah satunya dengan menggunakan laravel installer, kemudian dengan menjalankan perintah seperti di atas. Perintah di atas jika dijalankan akan membuatkan kita folder atau laravel project baru dengan nama laravel-ocr.

Getting Started

Oke, setelah melakukan langkah yang pertama yaitu menginstall laravel project dengan nama laravel-ocr, selanjutnya kita perlu menyiapkan OCR service yang akan dijelaskan di bawah ini.

Register Identifai Account

Seperti yang telah saya jelaskan di awal, pada artikel implementasi OCR KTP di laravel ini saya akan menggunakan OCR Service dari identifai. Untuk itu, kita perlu mendaftar atau membuat akun identifai untuk mendapatkan OCR service key dari Identifai. Silakan teman-teman mendaftar akun dengan register di situs resmi identifai.id.

Buy Quota

OCR statistic

Setelah berhasil mendaftar akun identifai, kita akan mendapatkan Trial Balance sebesar 100.000 IDR. Nah, dengan trial balance tersebut kita bisa membeli quota untuk product OCR KTP. Silakan buka halaman https://dashboard.identifai.id/usage/statistic, lalu klik button Buy Quota.

buy or top up OCR balance

Kemudian pilih analytic OCR KTP , Quota dan payment method menggunakan Trial Balance seperti contoh gambar di atas.

Get Access Key

Create OCR Access Key

Selanjutnya kita perlu melakukan generate Access Key. Silakan masuk ke menu Access Key dan klik button Create Access Key , maka kita akan mendapatkan Access Key ID dan Secret Access Key seperti contoh gambar di atas.

*Simpan kedua key tersebut, karena kita akan membutuhkannya di step berikutnya.

Generate Authorization Key

Generate Authorization Key

Semua API menggunakan parameter access key ID dan secret key pada header. Pasangan key-secret ini diasosiasikan dengan user dan memberikan permission kepada user untuk request API. Setelah kita mendapatkan access key dan secret key, kita perlu membuat authorization key untuk memasukkan ke dalam Authorization header.

Kirim request Post ke https://backend.cloud.nodeflux.io/auth/signatures dengan memberikan argumen sebagai application/json dengan request:

{
  "access_key": "{YOUR_ACCESS_KEY}",
  "secret_key": "{YOUR_SECRET_KEY}"
}
Enter fullscreen mode Exit fullscreen mode

maka kita akan mendapatkan response seperti

{
    "headers": {
        "x-nodeflux-timestamp": "20211213T062502Z"
    },
    "ok": true,
    "token": "b5005b75e579500fdd89ceee620414b70e021f7b730b647084dd4693d799d2"
}

Enter fullscreen mode Exit fullscreen mode

Setelah kita mendapatkan x-nodeflux-timestamp dan token, kita perlu membuat authorization key dengan format seperti di bawah ini.

NODEFLUX-HMAC-SHA256 Credential={ACCESS_KEY}/{DATE}/nodeflux.api.v1beta1.ImageAnalytic/StreamImageAnalytic, SignedHeaders=x-nodeflux-timestamp, Signature={TOKEN}
Enter fullscreen mode Exit fullscreen mode
Component to be changed Value
ACCESS_KEY Your access key from IdentifAI application
DATE Get the date from x-nodeflux-timestamp (yyyymmdd)
TOKEN Your token from endpoint response

Authorization key akan digunakan sebagai identifier setiap kita memanggil service API.

Implementasi OCR KTP

Okey, setelah kita selesai menyiapkan semua dari apa yang akan kita perlukan untuk implementasi OCR KTP di laravel, selanjutnya kita akan masuk ke koding. πŸ”₯

Setup OcrController

php artisan make:controller OcrController
Enter fullscreen mode Exit fullscreen mode

Silakan buat controller baru untuk membuat logic atau menerapkan OCR KTP service. Sebagai contoh, disini saya akan membuat controller baru dengan nama OcrController.

<?php

namespace App\Http\Controllers;

use Exception;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Validator;
use Illuminate\Support\Facades\Http;

class OcrController extends Controller
{
    public function ocrService(Request $request)
    {
        try {
            $validator = Validator::make($request->all(), [
                'file' => 'required|mimes:jpg,jpeg|max:800|dimensions:dimensions:min_width=200,min_height=200,max_width=2000,max_height=2000',
            ], [
                'file.required' => 'File tidak boleh kosong',
                'file.mimes' => 'File harus berupa jpg atau jpeg',
                'file.max' => 'File maksimal 800kb',
                'file.dimensions' => 'Ukuran file minimal 200x200px dan maksimal 2000x2000px',
            ]);

            if ($validator->fails()) {
                return response()->json([
                    'status' => '400',
                    'message' => $validator->errors()->first(),
                ], 400);
            }

            $file = base64_encode(file_get_contents($request->file('file')));

            $response = Http::withHeaders([
                'Authorization' => 'NODEFLUX-HMAC-SHA256 Credential={ACCESS_KEY}/{DATE}/nodeflux.api.v1beta1.ImageAnalytic/StreamImageAnalytic, SignedHeaders=x-nodeflux-timestamp, Signature={TOKEN}',
                'Content-Type' => 'application/json',
                'x-nodeflux-timestamp' => '{x-nodeflux-timestamp from your signature request}',
            ])->post('https://api.cloud.nodeflux.io/syncv2/analytics/ocr-ktp', [
                'client_ref' => 'ref' . time(),
                'images' => [
                    "data:image/jpeg;base64,{$file}",
                ]
            ]);

            return $response->json();

        } catch (Exception $err) {
            return response()->json([
                'status' => '500',
                'message' => $err->getMessage(),
            ], 500);
        }
    }
}
Enter fullscreen mode Exit fullscreen mode

Jika controller sudah dibuat, buka file controller tersebut lalu ubah codenya seperti di atas. Jadi, agar OCR KTP service dapat membaca data pada KTP, kita perlu mengubah file image yang dikirimkan menjadi base64. Perhatikan juga pada validatornya, OCR KTP service dari identifai ini hanya dapat digunakan untuk file KTP berformat jpg/jpeg, maksimal file size 800kb dan dengan ukuran dimensi minimal 200x200px dan maksimal 2000x2000px.

API Route

Route::post('ocr-ktp',[App\Http\Controllers\OcrController::class,'ocrService']);
Enter fullscreen mode Exit fullscreen mode

Selanjutnya disini kita perlu API route yang mengarah ke class controller yang sudah kita setup pada langkah sebelumnya.

Testing

testing laravel ocr

Berikutnya, di langkah terakhir ini kita bisa melakukan testing. Silakan jalankan laravel project kalian, kemudian buka postman dan buat request baru dengan method POST ke URL http://127.0.0.1:8000/api/ocr-ktp. Pada body, tambahkan property file (dengan type file) dan tambahkan value yang merupakan file dari KTP lalu klik Send. Jika berhasil, maka response yang dihasilkan akan seperti gambar di atas, semua data-data yang diperlukan pada KTP dapat terbaca oleh OCR ini.

Cukup sekian artikel kali ini, semoga apa yang telah saya tulis tentang implementasi OCR KTP di Laravel pada artikel ini dapat dengan mudah dipahami dan dapat membantu. See you πŸ‘‹

Credit: People illustrations by Storyset

Top comments (0)