vue中加载OCX控件(IE浏览器执行)

如何注册ocx控件, 并使用new ActiveXObject(“xxx”)调用接口中的方法

ocx 控件:它是可视化编程工具,就是工具条上的那些小按钮。每个控件都有自己的事件、方法和属性。使用了控件的编程非常容易
控件需要先注册才可以使用:如果给exe文件,直接用即可

一、使用exe安装文件,并将控件注册到注册表中

  • exe文件默认会安装在系统盘中,通常在 C:\Windows\SysWOW64\ 或者 C:\windows\system32\ 目录下
  • 找到相应的文件,复制dll或者ocx所在文件的全路径地址
  • 在管理员运行模式下,使用regsvr32注册
  1. 把要注册的OCX 或者 dll 文件放在系统目录下。
      32位系统将其复制到 C:\windows\system32\ 目录下。
      64位系统将其复制到 C:\Windows\SysWOW64\ 目录下。和C:\windows\system32\目录都放一份。

  2. 用“管理员身份”运行命令提示符。

开始–搜索命令提示符–右击选择以管理员身份运行。

  1. 32位系统输入 regsvr32 c:\Windows\system32\xxx.ocx 回车。

64位系统输入 :regsvr32 c:\Windows\SysWOW64\xxx.ocx regsvr32 c:\Windows\system32\xxx.ocx

  1. 当我们看到DllRegisterServer在C:\windows\sysWOW64\xxx.ocx 已成功的提示,那么就已经注册成功了。

二、使用控件中对应的projectId,通过new ActiveXObject(“xxx”)创建对象即可

  • 打开命令行,输入regedit打开注册表
  • 根据classid搜索到指定的控件
  • 继续搜索下一个,可以获得对应的progressId, ··

ActiveXObject对象

JavaScript中ActiveXObject对象是启用并返回 Automation 对象的引用。
使用方法:
newObj = new ActiveXObject( servername.typename[, location])

  1. servername是必选项。提供该对象的应用程序的名称。
  2. typename是必选项。要创建的对象的类型或类。
  3. location是可选项。创建该对象的网络服务器的名称。

切记:ActiveX是微软的东西,故而这玩意儿只有IE才支持!

对IE浏览器操作(开启internet的加载activex控件) (默认开启)
打开Internet Explorer “工具”的“Internet选项”一栏—“安全”----“自定义级别”选项卡 ---- 》“对没有标记为安全的activex控件进行初始化和脚本运行”设置成“启用”即可。

npm切换镜像以及解决cnpm无法使用的问题(windows)

npm install -g cnpm --registry=http://registry.npm.taobao.org

cnpm无法加载问题:以管理员身份打开powershell

  1. cmd打开窗口
  2. 输入PowerShell确定,以当前用户身份启动
  3. start-process PowerShell -verb runas 确定,以管理员身份启动
  4. set-ExecutionPolicy RemooteSigned 确认

babel的使用

针对es6语法如何在除chrome浏览器,到更低版本的浏览器中使用js

npm install --save-dev babel-loader @babel/core @babel/preset-env

  1. babel-loader 是翻译器
  2. babel-core 是核心库
  3. @babel/preset-env 真正的翻译(箭头函数es6 -> es5)
  4. @babel/polyfill 功能强大
    npm install --save @babel/polyfill // promise(类,对象) 和 map方法,—》打包为带有实线的函数

全局引入 import '@babel/polyfill'
按需引入 webpack配置

// webpack中的配置
module: {
    rules: [
        {
            test: /\.js$/,
            exclude: /node_modules/,
            use: {
                loader: 'babel-loader'options: {
                  presets: [
                    ['@babel/preset-env'{
                            useBuiltIns: 'usage' // 告诉@babel/polyfill按需引入
                        }
                    ]
                   ]
                }
            }
        }
    ]
}
  • –save 开发和项目运行都需要的依赖 (对应dependencies)
  • -save-dev 开发依赖,当项目部署了就不需要了,如webpack,gulp,babel (对应devDependencies)
    npm 5 + 默认安装的模块是添加到dependencies列表中,较老的必须指定–save参数

前面都是废话,实操如下

使用vue加载activeX控件

  1. 下载给定的ocx并运行
  2. 修改配置文件,在IE中执行(需要配置babel)
// vue.config.js
const path = require('path')
function resolve(dir) {
    return path.join(__dirname, dir)
}
module.exports = {
    publicPath: './',
    // 生产环境构建后的存放目录
    outputDir: './dist',
    // 是否生成 js sourcemap 文件,设置为 false 以满足安全测试要求
    productionSourceMap: false,
    css: {
        // 是否生成 css sourcemap 文件,设置为 false 以满足安全测试要求
        sourceMap: false
    },
    configureWebpack: {
        resolve: {
            alias: {
                'gxcaJs': resolve('src/utils/ggzy.js') // 导入ocx文件
            }
        }
    },
    // 需要babel转义的包
    transpileDependencies: ['microapp-plugin-apploader', 'microapp-framework-common', 'microapp-plugin-http']
};

// babel.config.js
module.exports = {
  presets: [
    [
      '@vue/app',
      {
        useBuiltIns: 'entry'
      },
      'stage-3'
    ]
  ]
}
// package.json
{
  "name": "pub_source",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build"
  },
  "dependencies": {
    "core-js": "^3.8.3",
    "vue": "^2.6.14"
  },
  "devDependencies": {
    "@babel/core": "^7.12.16",
    "@vue/cli-plugin-babel": "~5.0.0",
    "@vue/cli-service": "~5.0.0",
    "vue-template-compiler": "^2.6.14"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
  ]
}
  1. IE浏览器配置
    • 配置可信任站点,设置 ->安全 或 Internet选项 -> 安全, 找到可信站点配置:如果是在本机操作http:127.0.0.1, 如果是在mac上操作,则将启动的地址添加到可信站点即可
    • 配置自定义安全级别: 开启activeX功能
  2. 添加key(因为是签名,所以需要key)
  3. 最后看下控件的js代码(主要是new ActiveXObject这个对象即可)
     actx = new ActiveXObject("GXCA_GKEYINFO.GXCA_gKeyInfoCtrl.1");
     actx.xxx()即可
    
  • 0
    点赞
  • 0
    收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
©️2022 CSDN 皮肤主题:大白 设计师:CSDN官方博客 返回首页
评论

打赏作者

yy_33404590

你的鼓励将是我创作的最大动力

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值