title: chrome 插件实现mac地址获取 tags:
- chrome
- 插件
- 浏览器mac地址
- host
- 全平台 categories: chrome date: 2017-07-25 18:18:53
浏览器无法通过js获取到硬件信息众所周知,ie是也是通过ActiveX来完成的。
由于我们一直使用Chrome,因此考虑开发chrome插件。
普通chrome插件也是无法获取到mac地址等信息的,我们采取和本地通信app的实现。
-
准备宿主端,我们称之为host
-
准备插件端,我们称之为extension
如上图所示,我们通过插件端和host进行通信,插件也可以通过授权来访问 指定的页面的document。在进行指定编码格式约定后就可以进行我们的编码了。
对于chrome的插件开发我们就不说了,可以在网络上抄到一堆。
插件开发
manifest
{ "name": "F6养车PC版安全插件", "version": "1.0", "manifest_version": 2, "description": "使用本插件实现从指定PC登录系统", "background": { "scripts": [ "background.js" ] }, "icons": { "128": "icon-128.png" }, "browser_action": { "default_icon": "icon-19.png", "default_title": "F6养车PC版安全插件" }, "homepage_url": "http://m.f6car.com", "content_scripts": [ { "matches": [ "http://*/*" ], "js": [ "content.js" ], "run_at": "document_end" } ], "externally_connectable": { "matches": [ "http://*.f6car.com/*", "http://localhost:9001/*", "http://127.0.0.1:9001/*", "http://192.168.1.153:9001/*", "http://192.168.1.19:9001/*" ] }, "permissions": [ "nativeMessaging", "tabs", "http://*/*", "https://*/*" ] } 复制代码
content.js
对应后需要增加content.js 负责和页面dom交互
chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) { console.debug("chrome.runtime.onMessage called"); if (!!request.text) { console.debug("mac address:%s", request.text); var macEle = document.getElementById("mac"); if (!!macEle) { macEle.value = request.text } }