Add National ID OCR to Your App using Cursor in 5 Minutes

The problem: AI coding assistants can't parse holograms

Tools like Cursor are remarkable at writing code — but they stop at the boundary of complex vision tasks. You can instruct Cursor to build a beautiful KYC upload interface in minutes, yet the actual extraction of names, document numbers, and MRZ lines from a laminated ID card requires a dedicated National ID OCR API. Standard vision models routinely misread security fonts, hallucinate personal data, or fail entirely on holographic overlays and glare.

The solution: Global ID parsing, instantly

StructOCR's /v1/national-id endpoint accepts a photo and returns a clean JSON object with the validated identity fields. It automatically decodes Machine Readable Zones (MRZ) and handles complex, localized ID layouts. Because it speaks plain HTTP, Cursor can easily generate the client or server-side fetch logic to wire it up.

Integrate StructOCR using Cursor (3 Steps)

1. 1

   Open your project in Cursor and use Composer

   Open your web or mobile project in Cursor. Hit Cmd+I (or Ctrl+I) to open the Composer. Describe the onboarding UI you want to build.

   💬Try this prompt: "Build a mobile-friendly KYC onboarding UI component using shadcn. Users can upload a photo of their National ID card, and the app will display the extracted full name, document number, date of birth, and address in a clean card."
2. 2

   Tell Cursor to call the StructOCR API

   Once Cursor scaffolds the component, paste the follow-up prompt below. Cursor will write the fetch call, handle the form data, and wire the response to your state variables.

   💬Follow-up prompt: "When a user uploads an image, send it as a multipart/form-data POST to https://api.structocr.com/v1/national-id with an Authorization header containing my API key. Display the returned JSON fields in the UI."

   // Cursor generates something like this in your frontend framework const response = await fetch('https://api.structocr.com/v1/national-id', { method: 'POST', headers: { Authorization: `Bearer ${process.env.NEXT_PUBLIC_STRUCTOCR_KEY}` }, body: formData, });
3. 3

   Add your StructOCR API key to your .env file

   Open your local .env or .env.local file in Cursor and securely add your StructOCR key. Restart your development server to see the live scanner.

   💬Variable name: NEXT_PUBLIC_STRUCTOCR_KEY — get your free key at structocr.com/dashboard

   NEXT_PUBLIC_STRUCTOCR_KEY=sk_live_xxxxxxxxxxxxxxxx

What you can build in Cursor with this integration

• Fintech onboarding (KYC): Let users snap a photo of their ID to instantly populate sign-up forms without manual typing, drastically reducing drop-off rates in financial onboarding flows.
• Gig economy driver signup: Build a mobile portal where contractors upload their ID cards for instant identity verification, a crucial step for mobility and delivery apps.
• Age verification gates: Create a tool that scans a user's ID, calculates their age based on the extracted `date_of_birth`, and conditionally grants access to age-restricted goods or services.
• Visitor management systems: Add an upload step to a corporate check-in flow: extract visitor details automatically from their national ID to print temporary badges in seconds.

The prompt and the code

Copy the follow-up prompt into Cursor's Composer (Cmd+I) to generate the integration. The code block shows the standard fetch logic Cursor will likely produce.

Prerequisite: A free StructOCR account — get your API key at structocr.com/dashboard (no credit card required)

I need to add National ID OCR to this component.

When a user uploads an image:
1. Send it as multipart/form-data to: POST https://api.structocr.com/v1/national-id
2. Include the header: Authorization: Bearer ${process.env.NEXT_PUBLIC_STRUCTOCR_KEY}
3. The response is JSON with fields: data.surname, data.given_names, data.document_number, data.date_of_birth, data.address
4. Display the extracted identity data in a clear, formatted profile card
5. Show a loading spinner while the request is in flight
6. Show an error message if the upload fails

Use the environment variable NEXT_PUBLIC_STRUCTOCR_KEY for the API key.

What the API returns

A comprehensive JSON object containing both primary identity fields and specialized MRZ strings. Cursor can easily type this interface for TypeScript projects.

{
  "success": true,
  "data": {
    "type": "national_id",
    "country_code": "ROU",
    "nationality": "ROMANA",
    "document_number": "123456",
    "card_series": "KS",
    "personal_number": "1920319123456",
    "surname": "POPESCU",
    "given_names": "ANDREI",
    "sex": "M",
    "date_of_birth": "1992-03-19",
    "place_of_birth": "Jud. CS Mun. Reșița",
    "address": "Jud. CS Orș. Bocșa Str. Nucilor Nr. 15",
    "date_of_issue": "2020-05-10",
    "date_of_expiry": "2030-05-10",
    "issuing_authority": "SPCLEP Bocșa",
    "additional_fields": {
      "phone_number": null,
      "tramite_number": null,
      "ejemplar": null,
      "mrz_line_1": "IDROU123456<0<<<<<<<<<<<<<<<<",
      "mrz_line_2": "9203195M3005108ROU19203191234562",
      "mrz_line_3": null
    }
  }
}