In many business scenarios, users upload images (e.g., scanned documents, receipts, handwritten notes) through a portal. With Image-to-Text (OCR) capabilities, you can extract text content from these uploaded files and use it in workflows, data capture, or document automation. Power Pages, combined with AI Builder and Power Automate, makes this possible with low-code/no-code tools.
This guide walks you through how to process uploaded image files, extract text using OCR, and store or use that data effectively.
Use Case Example
A customer uploads a photo of an invoice on the portal. The system extracts key information like invoice number, date, and amount, and stores it in Dataverse for further processing.
Key Tools Involved
- Power Pages – For form submission and file upload
- Dataverse – For storing uploaded files and extracted text
- Power Automate – To process the image using AI Builder or Azure Cognitive Services
- AI Builder: Text Recognition (OCR) – To extract printed/handwritten text from images
Step-by-Step Implementation
Step 1: Design File Upload in Power Pages
- In Power Pages Studio:
- Add a form connected to a Dataverse table (e.g.,
ImageUploads). - Include a File column (type: File).
- Allow users to upload images (JPEG, PNG, etc.)
- Add a form connected to a Dataverse table (e.g.,
- Customize the form layout and label as per user expectations (e.g., “Upload your document” or “Upload handwritten note”).
- Save and publish the page.
Step 2: Create a Power Automate Flow
A. Trigger: When a row is added to a Dataverse table
- Trigger type:
When a row is added - Table:
ImageUploads - Scope: Organization
B. Get File Content
- Use the action
Get file or image contentfrom Dataverse - Input: Row ID and File column name
C. Use AI Builder – Extract text from image
- Action:
Extract text from an image using AI Builder - Input: Image content from previous step
This action supports JPEG, PNG, TIFF, and BMP formats, and detects:
- Printed text
- Handwritten text (basic support)
- Layout and lines
D. Parse Output
The response will return:
- Full text block
- Line-by-line text
- Coordinates (optional)
Extract key information using Compose or Parse JSON actions.
E. Update Dataverse Row with Extracted Text
- Use
Update a rowaction - Set fields like:
ExtractedText: Full text from OCRStatus: ProcessedTextDate: (Optional, parsed from content)
Step 3: Display Extracted Text in the Portal
- Add a read-only column (e.g.,
ExtractedText) on a separate view/form. - Show the processed data on a dashboard or submission confirmation page.
- Optionally allow users to edit or confirm the extracted values.
Advanced: Using Azure OCR (Computer Vision)
If you require advanced OCR, like table extraction, handwriting recognition, or multilingual support, you can use the Azure Computer Vision API.
A. Get Azure Credentials
- Create a Cognitive Services > Computer Vision resource in Azure.
- Note the endpoint and key.
B. Call Azure Vision API in Power Automate
- Use the HTTP action
- POST to
https://<region>.api.cognitive.microsoft.com/vision/v3.2/read/analyze - Headers:
Ocp-Apim-Subscription-Key: your-keyContent-Type: application/octet-stream`
- Body: Binary image file content
Then poll the result URL to get the processed text.
Handling Multiple Files
If your form accepts multiple images:
- Use a related table (one-to-many relationship) to store multiple file records per submission.
- Loop through each uploaded file in Power Automate and extract text individually.
Best Practices
| Practice | Description |
|---|---|
| File size limit | Ensure uploaded files are <4MB for AI Builder |
| File type restriction | Allow only image types: .jpg, .png, .bmp |
| Secure access | Use role-based access for data and flows |
| Logging | Store OCR logs or confidence scores for validation |
| Fallback | Handle cases where text extraction fails or returns empty |
Sample Dataverse Table Schema
| Column Name | Type | Description |
|---|---|---|
| Upload Name | Text | Name of submission |
| UploadedImage | File | Image uploaded by user |
| ExtractedText | Multiline | Full text output from OCR |
| ProcessedOn | DateTime | Date of OCR processing |
| Status | Choice | Pending, Processing, Completed |
User Experience Enhancement
- Add a “Processing…” spinner or message after submission.
- Display OCR results on the same screen using Power Pages liquid + Dataverse fetchXML.
- Let users confirm/edit extracted fields before final submission.
Limitations
| Feature | Limitation |
|---|---|
| AI Builder OCR | Doesn’t extract tables or rich layout |
| File size support | Max ~4MB |
| Handwriting support | Basic, not highly accurate |
| Response time | ~5–10 seconds for full process |