VLM-OCR-Demo：一個使用VLM用於OCR任務的示例

mingupupup發表於2024-12-09

前言

上一篇文章TesseractOCR-GUI：基於WPF/C#構建TesseractOCR簡單易用的使用者介面中我們構建了一個方便使用TesseractOCR的使用者介面，今天構建一個類似的介面，使用Semantic Kernel接入視覺模型，測試一下用視覺模型做OCR任務的效果。在之前的文章使用Tesseract進行圖片文字識別的總結中說了使用VLM做這個任務的缺點，經過測試之後，發現確實存在。

效果

在進行下一步之前，先大概瞭解一下效果。

測試圖片1：

檢視效果：

image-20241209102333915

測試圖片2：

檢視效果：

image-20241209102431184

在寫好提示詞的情況下，識別的效果還不錯。

但是還是不免會出現幻覺：

image-20241209102824355

需要自己調整到效果最好的模型。

普通使用者使用

跟之前的軟體一樣，我已經在GitHub釋出了壓縮包，點選下載，然後解壓即可。

GitHub地址：https://github.com/Ming-jiayou/VLM-OCR-Demo

image-20241209103223078

這裡我選擇依賴框架的版本：

image-20241209103316699

下載解壓之後如下所示：

image-20241209103826202

有一個.env檔案，用於配置VLM的API Key。這是因為我電腦的配置不太行，無法本地用Ollama跑視覺模型，因此只能使用大模型服務商的。由於SiliconCloud還有額度，並且相容了OpenAI格式，因此我這裡選擇接入SiliconCloud。現在註冊有送2000萬token的活動，最nice的一點是送的token沒有時間期限。想試試的朋友可以點選連結：https://cloud.siliconflow.cn/i/Ia3zOSCU，註冊使用。

註冊之後，複製一個API Key：

image-20241209104442404

開啟.env填入API Key，注意API Key不要隨意洩露，放心這是儲存在自己的電腦上，我不會知道。

如下所示，不要留空格：

image-20241209104551110

然後開啟VLM-OCR-Demo.exe即可使用啦！！

我已經寫好了一個用於OCR的Prompt：

image-20241209104709811

缺點還是會存在，這裡自動翻譯成了中文，可以再試一下：

image-20241209104904726

又正常了，也可以重新調整一下Prompt。

當然VLM如果只是用於OCR有點太奢侈了，OCR只是VLM的一個基礎功能，還可以執行其他與影像有關的任務。

描述圖片：

image-20241209105338613

分析圖表：

image-20241209105645807

更多功能可由讀者自行探索。

WPF/C# 程式設計師使用

將專案Fork到自己賬號下，git clone 到本地，開啟解決方案，專案結構如下：

image-20241209105907884

由於.env檔案包含API Key這個敏感資訊，因此我沒有上傳到GitHub上，自己在同樣的位置新建一個.env檔案，格式如下所示：

SILICON_CLOUD_API_KEY=sk-xxx

填入自己的SILICON_CLOUD_API_KEY，如下所示：

image-20241209104551110

設定.env檔案的屬性：

image-20241209110301990

這樣設定一下，應該就可以啟動了。

開發工具：Visual Studio 2022

.NET版本：.NET 8

使用SemanticKernel很方便我們接入大語言模型到我們自己的應用中，之前只接入過對話模型，還沒有試過接入視覺模型，其實接入也很簡單，SemanticKernel大大簡化了接入操作。

核心程式碼：

 private async Task ExecuteAskAICommand()
 {
     if (AskAIResponse != "")
     {
         AskAIResponse = "";
     }
     if (SelectedVLM == null)
     {
         SelectedVLM = "Pro/OpenGVLab/InternVL2-8B";
     }
     IKernelBuilder kernelBuilder = Kernel.CreateBuilder();
     kernelBuilder.AddOpenAIChatCompletion(
         modelId: SelectedVLM,
         apiKey: SiliconCloudAPIKey,
         endpoint: new Uri("https://api.siliconflow.cn/v1")
     );
     Kernel kernel = kernelBuilder.Build();

     var chatCompletionService = kernel.GetRequiredService<IChatCompletionService>();

     if (SelectedFilePath == null)
     {
         return;
     }

     byte[] bytes = File.ReadAllBytes(SelectedFilePath);

     // Create a chat history with a system message instructing
     // the LLM on its required role.
     var chatHistory = new ChatHistory("你是一個描述圖片的助手，全程使用中文回答");

     // Add a user message with both the image and a question
     // about the image.
     chatHistory.AddUserMessage(
       [
         new TextContent(AskAIText),
         new ImageContent(bytes, "image/jpeg"),
       ]);

     // Invoke the chat completion model.        
     var response = chatCompletionService.GetStreamingChatMessageContentsAsync(
                                 chatHistory: chatHistory,
                                 kernel: kernel
                             );
     await foreach (var chunk in response)
     {
         AskAIResponse += chunk;
     }
 }

這只是一個簡單的Demo，可供學習使用，具體的最佳使用方式，可根據自己的專案需求調整，其他程式碼可自行探索。

最後

本專案是一個使用VLM用於OCR任務與使用SemanticKernel將VLM接入自己應用的簡單Demo，對WPF/C#新手程式設計師，也可以當作一個簡單的練手小專案。

如果對你有所幫助，點顆star⭐，就是最大的支援！！

相關文章