nativeMessaging - 本地消息传递

最新推荐文章于 2023-01-09 23:09:47 发布

杭家y

最新推荐文章于 2023-01-09 23:09:47 发布

阅读量2.6k

点赞数

分类专栏：技术研究文章标签： chrome edge python java

本文链接：https://blog.csdn.net/chenhangx/article/details/121288664

版权

一.参考文档

二.官方提供示例-Python版

使用步骤：
1.在浏览器扩展中安装插件(app文件夹)
2.运行install_host.bat，添加注册表
3.运行native-messaging-example-host.bat（启动python程序）
4.在浏览器插件的html页面中调用(python程序)

浏览器端

在这里插入图片描述

这个插件包含了三个文件：manifest.json(这个是插件配置信息文件),background.js( 后台文件可以调用HTML页面),main.html（插件的主页面），main.js(与页面交互，传递消息给后台)。

存在的问题：官方demo不需要background.js，本地安装插件浏览器不显示图标，目前只能通过background.js调起主页面。
前端debuger查看执行流程。

manifest.json

创建浏览器的插件配置信息文件

{
   
  "key": "MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDcBHwzDvyBQ6bDppkIs9MP4ksKqCMyXQ/A52JivHZKh4YO/9vJsT3oaYhSpDCE9RPocOEQvwsHsFReW2nUEc6OLLyoCFFxIb7KkLGsmfakkut/fFdNJYh0xOTbSN8YvLWcqph09XAY2Y/f0AL7vfO1cuCqtkMt8hFrBGWxDdf9CQIDAQAB",
  "name": "Native Messaging Example",
  "version": "1.0",
  "manifest_version": 2,
  "description": "Send a message to a native application.",
  //app调用main.html不生效
  "app": {
   
    "launch": {
   
      "local_path": "main.html"
    }
  },
  "background" : {
    "scripts": ["background.js"] },//为了调用html
  "icons": {
   
    "128": "icon-128.png"
  },
  "permissions": [
    "nativeMessaging"//允许本地通信权限
  ]
}

main.html

调用main.js与后台通信，

<!DOCTYPE html>

<html>
  <head>
    <script src='./main.js'></script>
  </head>
  <body>
    <button id='connect-button'>Connect</button>
    
    <input id='input-text' type='text' />
    
    <button id='send-message-button'>Send</button>
    <div id='response'></div>
  </body>
</html>

mian.js

var port = null;

var getKeys = function(obj){
   
   var keys = [];
   for(var key in obj){
   
      keys.push(key);
   }
   return keys;
}


function appendMessage(text) {
   
  document.getElementById('response').innerHTML += "<p>" + text + "</p>";
}

function updateUiState() {
   
  if (port) {
   
    document.getElementById('connect-button').style.display = 'none';
    document.getElementById('input-text').style.display = 'block';
    document.getElementById('send-message-button').style.display = 'block';
  } else {
   
    document.getElementById('connect-button').style.display = 'block';
    document.getElementById('input-text').style.display = 'none';
    document.getElementById('send-message-button').style.display = 'none';
  }
}

function sendNativeMessage() {
   
  message = {
   "text": document.getElementById('input-text').value}

最低0.47元/天解锁文章

杭家y

关注

0
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
nativeMessaging - 本地消息传递

微软官网文档https://www.youtube.com/watch?v=Odei9r2SB78chrome开发指南csdn参考资料十进制和26进制转换算法https://github.com/appemit/appemit/blob/master/README_zh.md
复制链接

扫一扫