В своей последней статье я рассказал, как собрать компонент WinRT с Dynamsoft Barcode Reader C++ SDK. В этой статье показано, как использовать сгенерированные файлы Dynamsoft.dll и Dynamsoft.winmd в проекте подключаемого модуля Cordova для создания приложений для Windows 10.

Установка

Мое первое приложение для Windows с Cordova

Запустите инструмент командной строки VS 2017.

Установите Кордову:

npm install -g cordova

Создайте новый проект:

cordova create test com.dynamsoft.test Test

Добавьте платформу Windows:

cordova platform add windows

Создайте приложение:

cordova build windows

Вы можете увидеть следующую ошибку:

c:\Prog ram Files (x86)\Microsoft Visual Studio\2017\Community\MSBuild\Microsoft\VisualStudio\v15.0\JavaScript\Microsoft.Visual Studio.WJProject.Default.props" was not found.

Ошибка означает, что у вас не установлены SDK и инструменты, относящиеся к JavaScript. Откройте установщик Visual Studio, чтобы проверить его.

Создание плагина Cordova с помощью WinRT и собственных библиотек DLL

Мы можем следовать официальному руководству, чтобы создать базовый плагин Cordova.

Вот мой:

Примечание. Для просмотра файлов .winmd можно использовать ildasm.exe, расположенный в папке C:\Program Files (x86)\Microsoft SDK\Windows\v10.0A\bin\NETFX 4.6.2 Tools.

Файл package.json создается командой NPM:

{
"name": "cordova-windows-barcode",
"version": "0.0.1",
"description": "Cordova Windows barcode",
"cordova": {
"id": "cordova-windows-barcode",
"platforms": [
"windows"
]
},
"keywords": [
"cordova",
"barcode",
"ecosystem:cordova",
"cordova-windows"
],
"author": "Dynamsoft",
"license": "MIT"
}

Настройте модули JavaScript, компонент C++/WinRT и собственные библиотеки DLL в plugin.xml:

<?xml version="1.0" encoding="UTF-8"?>
<plugin xmlns="http://apache.org/cordova/ns/plugins/1.0" id="barcode" version="0.1.0">
<js-module src="www/barcode.js" name="Barcode">
<clobbers target="cordova.plugins.barcode" />
</js-module>
<!-- windows -->
<platform name="windows">
<js-module src="src/windows/barcodeProxy.js" name="BarcodeProxy">
<merges target="" />
</js-module>
<resource-file src="src/windows/libs/x86/DynamsoftBarcodeReaderx86.dll" target="DynamsoftBarcodeReaderx86.dll" arch="x86" reference="true" />
<resource-file src="src/windows/libs/x86/DynamicPdf.dll" target="DynamicPdf.dll" arch="x86" reference="true" />
<resource-file src="src/windows/libs/x86/vcomp110.dll" target="vcomp110.dll" arch="x86" reference="true" />
<framework src="src/windows/libs/x86/BarcodeComponent.winmd" target-dir="x86" arch="x86" custom="true"/>
<framework src="src/windows/libs/x86/Dynamsoft.winmd" target-dir="x86" arch="x86" custom="true" implementation="src/windows/libs/x86/Dynamsoft.dll"/>
</platform>
</plugin>
view raw plugin.xml hosted with ❤ by GitHub

Для связи с собственной платформой вызовите cordova.exec в barcode.js:

function BarcodeReader() {
}
BarcodeReader.prototype.decodeFileStream = function(successCallback, errorCallback) {
cordova.exec(successCallback, errorCallback, "Barcode", "decodeFileStream");
};
var barcodeReader = new BarcodeReader();
module.exports = barcodeReader;
view raw barcode.js hosted with ❤ by GitHub

В barcodeProxy.js используйте средство выбора файлов для загрузки файлов изображений и вызовите decodeFileStream() для считывания штрих-кодов:

cordova.commandProxy.add('Barcode', {
decodeFileStream: function(successCallback, errorCallback) {
var picker = new Windows.Storage.Pickers.FileOpenPicker();
picker.ViewMode = Windows.Storage.Pickers.PickerViewMode.Thumbnail;
picker.SuggestedStartLocation =
Windows.Storage.Pickers.PickerLocationId.PicturesLibrary;
picker.fileTypeFilter.append('.jpg');
picker.fileTypeFilter.append('.jpeg');
picker.fileTypeFilter.append('.png');
picker.pickSingleFileAsync().then(function(file) {
if (file != null) {
Windows.Storage.FileIO.readBufferAsync(file).then(function(buffer) {
let reader = new Dynamsoft.BarcodeReader();
let result = reader.decodeFileStream(buffer);
successCallback(result);
});
} else {
errorCallback('Operation cancelled.');
}
});
}
});
view raw barcodeProxy.js hosted with ❤ by GitHub

Добавьте плагин в свой проект:

cordova plugin add <local plugin path>

Укажите архитектуру (x86 или x64) для запуска приложения:

cordova run windows -- --arch="x86"

К сожалению, приложение не работает при вызове собственного API. Я отлаживал приложение в Visual Studio и получил исключение:

Exception is about to be caught by JavaScript library code at line 15, column 13 in ms-appx-web://com.dynamsoft.test/www/plugins/barcode/src/windows/barcodeProxy.js 0x8007007e - JavaScript runtime error: The specified module could not be found.

Это похоже на ошибку, потому что модуль отсутствует. После того, как я создал пустой файл .winmd, созданный с помощью шаблона C#, и добавил его в качестве ссылки, исключение исчезло.

использованная литература

Исходный код

https://github.com/yushulx/cordova-windows-barcode

Первоначально опубликовано на www.codepool.biz 20 ноября 2018 г.