桌面端electron-vue实战调用c++生成的DLL（算法接口）

温馨提示：创建一个electron-vue脚手架工程，不懂的创建electron-vue脚手架工程的老铁，可参考我上一个写的博客（node搭建eletrcon-vue脚手架框架开发桌面端程序链接：https://blog.csdn.net/qq1020654861/article/details/109294117）1.脚手架创建成功后，查看electron版本是否最新的，最新的版本我也不知道会

不会主动学习的小白

3246人浏览 · 2020-10-28 11:25:46

不会主动学习的小白 · 2020-10-28 11:25:46 发布

温馨提示：创建一个electron-vue脚手架工程，不懂的创建electron-vue脚手架工程的老铁，可参考我上一个写的博客（node搭建eletrcon-vue脚手架框架开发桌面端程序链接：https://blog.csdn.net/qq1020654861/article/details/109294117）

1.脚手架创建成功后，查看electron版本是否最新的，最新的版本我也不知道会出现什么样的问题，我采用的是electron：2.0.18

2.修改electron 32位命令（：npm install --arch=ia32 electron）在此之前，请删掉当前node_modules依赖，删除后执行命令，然后在执行（cnpm install）

3.node_modules依赖下载成功后，导入到node_modules所需的FFI依赖，导入成功后在当前目录中建立一个DLL文件夹（DLL文件夹下放你的dll文件）

提示：FFI架包因上传不上去，需要的请留言一对一发送

C++测试代码

test.h

class TESTDLL_API CtestDll {
public:
	CtestDll(void);
};
 
extern "C"
{
	TESTDLL_API int Double(int a);
}

test.cpp

// testDll.cpp : 定义 DLL 的导出函数。
//
 
#include "test.h"
 
// 这是导出函数的一个示例。
TESTDLL_API int Double(int a)
{
    return a*2;
}

electron调用DLL代码

'use strict';

const ffi = require('ffi');
const path = require('path');
const demo = ffi.Library(path.join(__dirname, '../../../../../../dll/dlltest.dll'), {
    "Double": ['int', ['int']]
});

4.调用DLL文件的JS写好后找到当前的项目的index.ejs文件中把JS导入进去（如下图所示）

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>my-project</title>
    <% if (htmlWebpackPlugin.options.nodeModules) { %>
      <!-- Add `node_modules/` to global paths so `require` works properly in development -->
      <script>
        require('module').globalPaths.push('<%= htmlWebpackPlugin.options.nodeModules.replace(/\\/g, '\\\\') %>')
      </script>
    <% } %>
  </head>
  <script type="text/javascript" src="../index.js"></script>
  <body>
    <div id="app"></div>
    <!-- Set `__static` path to static files in production -->
    <% if (!process.browser) { %>
      <script>
        if (process.env.NODE_ENV !== 'development') window.__static = require('path').join(__dirname, '/static').replace(/\\/g, '\\\\')
      </script>
    <% } %>

    <!-- webpack builds are automatically injected -->
  </body>
</html>

5.在vue面中的mounted页面初始化加载中调用DLL接口（如下图所示）温馨提示：我DLL中的Double接口返回的是一个a*2 所以按道理来说我输入2 会返回给我一个4

6.运行程序 npm run dev 打开程序后会发现控制台中输出结果为（以下图所示）

7.大功告成哦耶

错误提示：报Error: Dynamic Retrieval Win32error 126是（DLL路径没找到）

错误提示：报Error: Dynamic Symbol Retrieval Error: Win32 error 127 （生成的c++ dll有问题，没有导出，所以调用dll的时候找不到对应的方法）

报错 Error: Dynamic Linking Error: Win32 error 193 （dll错生成了86位的。改成64位即可）

需要demo项目路径：https://download.csdn.net/download/qq1020654861/21547731

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^