electron和PCSC-lite使用

建立一个electron项目：html

建立空文件夹，而后打开命令行

npm init

文件目录中会出来一个package.json文件：node

{
  "name": "pcscdemo",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

把这个 Node 应用转换成一个 Electron 应用也是很是简单的，咱们只不过是把 node 运行时替换成了 electron 运行时。
package.json中不要有注释，这个是方便理解的，在运行时要删除c++

{
  "name": "pcscdemo",
  "version": "1.0.0",
  "description": "",
  "main": "main.js",    //这是electron的主进程
  "scripts": {
    "start": "electron ."
  },
  "author": "",
  "license": "ISC"
}

安装 Electron
须要安装electron。咱们推荐的安装方法是把它做为您 app 中的开发依赖项，这使您能够在不一样的 app 中使用不一样的 Electron 版本。在您的app所在文件夹中运行下面的命令：

npm install --save-dev electron

出现下图即为安装成功：
git

开发一个简单的electron项目
Electron apps 使用JavaScript开发，其工做原理和方法与Node.js 开发相同。 electron模块包含了Electron提供的全部API和功能，引入方法和普通Node.js模块同样：

const electron = require('electron')

完整的main.js文件以下：github

const { app, BrowserWindow } = require('electron')

// 保持对window对象的全局引用，若是不这么作的话，当JavaScript对象被
// 垃圾回收的时候，window对象将会自动的关闭
let win

function createWindow () {
  // 建立浏览器窗口。
  win = new BrowserWindow({ width: 800, height: 600 })

  // 而后加载应用的 index.html。
  win.loadFile('index.html')

  // 打开开发者工具
  win.webContents.openDevTools()

  // 当 window 被关闭，这个事件会被触发。
  win.on('closed', () => {
    // 取消引用 window 对象，若是你的应用支持多窗口的话，
    // 一般会把多个 window 对象存放在一个数组里面，
    // 与此同时，你应该删除相应的元素。
    win = null
  })
}

// Electron 会在初始化后并准备
// 建立浏览器窗口时，调用这个函数。
// 部分 API 在 ready 事件触发后才能使用。
app.on('ready', createWindow)

// 当所有窗口关闭时退出。
app.on('window-all-closed', () => {
  // 在 macOS 上，除非用户用 Cmd + Q 肯定地退出，
  // 不然绝大部分应用及其菜单栏会保持激活。
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', () => {
  // 在macOS上，当单击dock图标而且没有其余窗口打开时，
  // 一般在应用程序中从新建立一个窗口。
  if (win === null) {
    createWindow()
  }
})

// 在这个文件中，你能够续写应用剩下主进程代码。
// 也能够拆分红几个文件，而后用 require 导入。

最后编辑想显示的index.html:web

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Hello World!</title>
  </head>
  <body>
    <h1>Hello World!</h1>
    We are using node <script>document.write(process.versions.node)</script>,
    Chrome <script>document.write(process.versions.chrome)</script>,
    and Electron <script>document.write(process.versions.electron)</script>.
  </body>
</html>

在此，就能够运行：chrome

electron .

安装PCSC-litenpm

npm i pcsclite

会报错json

$ npm i pcsclite

> buffertools@2.1.6 install E:\aPritice\dd\electron\electronandpc\node_modules\buffertools
> node-gyp rebuild


E:\aPritice\dd\electron\electronandpc\node_modules\buffertools>if not defined npm_config_node_gyp (node "C:\Users\d\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild )  else (node "C:\Users\d\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js" rebuild )
Warning: unrecognized setting VCCLCompilerTool/MultiProcessorCompilation
Warning: unrecognized setting VCCLCompilerTool/MultiProcessorCompilation
????????????????????????????????ò??????????????/m???????
MSBUILD : error MSB3428: δ????? Visual C++ ?????VCBuild.exe??????????????1) ??? .NET Framework 2.0 SDK??2) ??? Microsoft Visual Studio 2005???? 3) ?????????????????????λ???????λ????????·???С? [E:\aPritice\dd\electron\electronandpc\node_modules\buffertools\build\binding.sln]
gyp ERR! build error
gyp ERR! stack Error: `C:\Windows\Microsoft.NET\Framework\v4.0.30319\msbuild.exe` failed with exit code: 1
gyp ERR! stack     at ChildProcess.onExit (C:\Users\zoe\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\build.js:262:23)
gyp ERR! stack     at ChildProcess.emit (events.js:182:13)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:240:12)
gyp ERR! System Windows_NT 10.0.17134
gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\d\\AppData\\Roaming\\npm\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild"
gyp ERR! cwd E:\aPritice\dd\electron\electronandpc\node_modules\buffertools
gyp ERR! node -v v10.15.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
npm WARN pcscdemo@1.0.0 No description
npm WARN pcscdemo@1.0.0 No repository field.

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! buffertools@2.1.6 install: `node-gyp rebuild`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the buffertools@2.1.6 install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\d\AppData\Roaming\npm-cache\_logs\2019-02-18T11_04_44_471Z-debug.log

对于这个问题，查询了不少文档，而后跟着运行了下，
先下载c++的库，http://8dx.pc6.com/xjq6/MSVBCRT_AIO_2019.01.25.zip，
下载后，解压安装；
这个安装后，netframework 4.0 也安装下，这个能够直接在Windows设置内打开这个功能
下载netframework 地址：https://www.microsoft.com/en-US/Download/confirmation.aspx?id=17718；windows

以管理员身份运行cmd:

npm install --global --production windows-build-tools

等待完成，很漫长

，
虽然上述的命令完成了，可是个人本地仍是不能正常npm i pcsclite;

E:\GD>npm i pcsclite

> buffertools@2.1.6 install E:\GD\node_modules\buffertools
> node-gyp rebuild


E:\GD\node_modules\buffertools>if not defined npm_config_node_gyp (node "C:\Users\zoe\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild )  else (node "C:\Users\zoe\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js" rebuild )
Warning: unrecognized setting VCCLCompilerTool/MultiProcessorCompilation
Warning: unrecognized setting VCCLCompilerTool/MultiProcessorCompilation
在此解决方案中一次生成一个项目。若要启用并行生成，请添加“/m”开关。
MSBUILD : error MSB3428: 未能加载 Visual C++ 组件“VCBuild.exe”。要解决此问题，1) 安装 .NET Framework 2.0 SDK；2) 安装 Microsoft Visual Stu
dio 2005；或 3) 若是将该组件安装到了其余位置，请将其位置添加到系统路径中。 [E:\GD\node_modules\buffertools\build\binding.sln]
gyp ERR! build error
gyp ERR! stack Error: `C:\Windows\Microsoft.NET\Framework\v4.0.30319\msbuild.exe` failed with exit code: 1
gyp ERR! stack     at ChildProcess.onExit (C:\Users\zoe\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\build.js:262:23)
gyp ERR! stack     at ChildProcess.emit (events.js:182:13)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:240:12)
gyp ERR! System Windows_NT 10.0.17134
gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\zoe\\AppData\\Roaming\\npm\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild"
gyp ERR! cwd E:\GD\node_modules\buffertools
gyp ERR! node -v v10.15.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
npm WARN enoent ENOENT: no such file or directory, open 'E:\GD\package.json'
npm WARN GD No description
npm WARN GD No repository field.
npm WARN GD No README data
npm WARN GD No license field.

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! buffertools@2.1.6 install: `node-gyp rebuild`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the buffertools@2.1.6 install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\zoe\AppData\Roaming\npm-cache\_logs\2019-02-20T02_09_57_123Z-debug.log

npm i windows-build-tools 原本这一条命令就能够的但不知道为啥没安装，我就手动打开软件Visual Studio installer，安装的。
下方页面找不到，能够点击这里就会直接下载，而后就会出现如下的页面（2019-04-24日添加）

就能够

npm install pcsclite

运行,下载 pcsclite了，感受好艰难。。。

接着就能够继续踩坑了：

官网：https://www.npmjs.com/package/pcsclite

windows+R，进入CMD—输入：services.msc回车，打开不少的程序程序

找到Smart Card ，设置为自动启动类型，确认。

而后运行 npm run start

而后会报错：

服务会本身中止：

网上不少遇到相同问题的人：
社区讨论有：https://social.technet.microsoft.com/Forums/en-US/9a411810-5ced-4513-a3e3-96b07ae0a0f6/smartcard-service-never-stays-in-quotautomaticquot-mode?forum=win10itprogeneral；
https://superuser.com/questions/773257/scardestablishcontext-service-not-available；
https://social.msdn.microsoft.com/Forums/en-US/8654d538-befa-4e5f-ba47-7a3b35bc4591/scardlistreaders-returns-0x6bf?forum=vssmartdevicesnative；

换个其余的类库试试：nfc-pcsclite
能够直接拉一下npm网站中，nfc-pcsclite的示例代码：
若是要查看它的运行状况，请克隆此存储库，使用npm安装依赖项并运行npm run example。

git clone https://github.com/pokusew/nfc-pcsc.git
cd nfc-pcsc
npm install
npm run example

在运行npm run start,过程当中，

在electron中若是要使用node的原生库，须要看这个文档
https://electronjs.org/docs/tutorial/using-native-node-modules
须要先下载electron-rebuild，必定要写–save，保存到依赖中

npm install --save electron-rebuild

须要使用这个对一些模块进行编译，也要在package.json中dependence，才可使用
须要从新输入如下命令（逐条）：

rm -rf node_modules
npm install
npx electron-rebuild
npm run start

而后运行代码 npm run start，个人项目中止不动了：

仍是运行不起做用，这时候你就须要一个读卡器硬件来辅助。我找了一个NFC读卡器，插入到电脑中。
有的硬件须要装驱动，下载适合的驱动，而后链接读卡器。
链接好硬件，就能够从新启动项目了，若是你有相对应的卡，能够启动后，插入读卡器，个人pcsc代码是看npm库的官网案例，直接拷贝进入main.js的，后根据不一样须要去调整代码，而后

npm run start

不仅是页面出来了，命令行也打印出东西了，为何只有removed呢？由于把卡插反了,尴尬了…,正确插入卡片就会打印出你想要的数据

你能够console.log一些信息出来，以便本身能够进行操做
而后就能够正常的编辑代码了。
感受这个坑，跳了很久，也蒙圈了好久，记录下，帮助本身加深印象!!!
加油！有问题的也能够交流沟通，不对的请指出来，一块儿学习！

本文同步分享在博客“zoepriselife316”（CSDN）。
若有侵权，请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”，欢迎正在阅读的你也加入，一块儿分享。