由于移動設(shè)備的處理能力和儲存空間限制，在移動設(shè)備上執(zhí)行光學(xué)字符識別（OCR）一直以來都是一項較大的挑戰(zhàn)。隨著LEADTOOLS HTML5的出現(xiàn)，在移動設(shè)備上執(zhí)行光學(xué)字符識別（OCR）變成可能。憑借LEADTOOLS HTML5提供的HTML5查看器和RESTful Web服務(wù)，開發(fā)人員可以在任何桌面，平板電腦和移動設(shè)備上面創(chuàng)建難以置信的光學(xué)字符識別（OCR）應(yīng)用程序。接下來，我們將展示如何在通過RESTful Web服務(wù)實現(xiàn)整頁識別。

在無需下載大型的語言識別庫和可執(zhí)行文件的情況下，LEADTOOLS OCR RESTful Web服務(wù)提供了一項非常簡便的方法將OCR識別添加到應(yīng)用程序。通過簡單的參數(shù)設(shè)置，并返回一個易于解析的帶有文本的JSON結(jié)構(gòu)。

通過查看器內(nèi)置的rubber band事件，選擇一塊矩形區(qū)域。使用鼠標點擊，并拖動鼠標，或者在觸屏上滑動手指，用戶可以在圖像上選擇一塊矩形區(qū)域，然后處理事件，并將坐標傳遞到Web服務(wù)。一旦服務(wù)完成處理任務(wù)，接下來用戶就可以使用JSON來解析響應(yīng)并根據(jù)應(yīng)用程序需要來顯示或者使用所識別的文本。下面的例子，我們只是簡單地顯示了提示框中的文本。

_selectRecognizeArea_RubberBandCompleted$1: function HTML5DemosLibrary__ocrDemo$_selectRecognizeArea_RubberBandCompleted$1(sender, e) {
// Get the selected area and use that as a zone for the OCR service
var searchArea = Leadtools.LeadRectD.fromLTRB(e.get_point1().get_x(), e.get_point1().get_y(), e.get_point2().get_x(), e.get_point2().get_y());
var visibleRect = _viewer.imageControlRectangle(true);
searchArea.intersect(visibleRect);
searchArea = _viewer.convertRect(Leadtools.Controls.CoordinateType.control, Leadtools.Controls.CoordinateType.image, searchArea);
if (searchArea.get_width() > 3 && searchArea.get_height() > 3) {
this._recognize$1(searchArea);
}
},

_recognize$1: function HTML5DemosLibrary__ocrDemo$_recognize$1(searchArea) {
// display the loading gif while we wait
this.beginOperation();

// build the service request
var rest = this.buildServiceUrl('ocr.svc');
rest += '/GetText?uri=';
rest += _viewer.get_imageUrl();
var imageSize = _viewer.get_imageSize();
rest += '&width=';
rest += parseInt(imageSize.get_width());
rest += '&height=';
rest += parseInt(imageSize.get_height());
if (!searchArea.get_isEmpty()) {
// no selection was made, recognize the whole image
rest += '&left=';
rest += parseInt(searchArea.get_left());
rest += '&top=';
rest += parseInt(searchArea.get_top());
rest += '&right=';
rest += parseInt(searchArea.get_right());
rest += '&bottom=';
rest += parseInt(searchArea.get_bottom());
}

// create the request and event handler
var request = new XMLHttpRequest();
var _this = this;
var readyStateChanged = function() {
if (request.readyState === 4) {
if (request.status === 200) {
var results = null;
if (request.responseText != null && request.responseText.length > 0) {
results = JSON.parse(request.responseText);
}
else {
alert('No text was found in the specified area, please select another area that contains text and try again.');
}
request.onreadystatechange = null;
request = null;
_this.endOperation(false);
if (results != null) {
alert (results);
}
}
else {
_this.showRequestError(request);
}
}
};

// send the request
request.onreadystatechange = readyStateChanged;
request.open('GET', rest, true);
request.send();
},

運行上面的代碼，你會發(fā)現(xiàn)如果沒有矩形傳遞給識別功能，LEADTOOLS會創(chuàng)建一個完整的圖像然后調(diào)用web服務(wù)。因此，你需要創(chuàng)建一個非常簡單的按鈕處理程序來完成整頁識別。

var recognizeButton = document.getElementById('recognizeButton');
recognizeButton.addEventListener('click', function(e) {
// recognize the entire image by sending an empty zone
_this._recognize$1(Leadtools.LeadRectD.get_empty());
}, false);