JSRPC的三种实现方式

news2025/1/17 6:07:32

RPC 为远程过程调用,本文通过在浏览器端(服务端)开启一个WebSocket服务,接收命令,执行浏览器网页的加密代码,得到密文。
CMD端(客户端)也开启一个WebSocket服务与浏览器端交互,通过标准输入把命令发送给浏览器执行。

RPC简单实现

原测试网站

有一个base64的加密函数,是我们要调用的函数。

function encrypt(message){
    base64 = btoa(message);
    console.log(base64);
    return base64;
}
encrypt("abc");

浏览器本地替换:

通过浏览器的“保存并覆盖”本地替换功能,新增WebSocket通信客户端代码。

// test

function encrypt(message) {
    base64 = btoa(message);
    console.log(base64);
    return base64;
}
encrypt("abc");

(function () {
    var ws = new WebSocket("ws://127.0.0.1:5678")

        ws.onmessage = function (evt) {
        console.log("收到消息:" + evt.data);
        if (evt.data == "exit") {
            wx.close();
        } else {
            ws.send(encrypt(evt.data));
        }
    }
})()

1

Python实现websocket客户端

import sys
import asyncio
import websockets

async def receive_message(websocket):
    while True:
        send_text = input("请输入要加密的字符串:")
        if send_text == "exit":
            print("退出!")
            await websocket.send(send_text)
            await websocket.close()
            sys.exit()
        else:
            await websocket.send(send_text)
            response_text =await websocket.recv()
            print("\n加密结果:", response_text)
            
start_server = websockets.serve(receive_message, "127.0.0.1", 5678)
asyncio.get_event_loop().run_until_complete(start_server)
asyncio.get_event_loop().run_forever()

最终效果:
1

JsRpc的封装:github.com/jxhczhl/JsRpc

项目地址:https://github.com/jxhczhl/JsRpc

开启服务

go run main.go

1

浏览器替换JS

把JsEnv.js代码和一下代码替换。

// 注入环境后连接通信
var demo = new Hlclient("ws://127.0.0.1:12080/ws?group=zzz&name=hlg");

1

执行

import requests

jscode = """
(function(){
    console.log("test")
    return "执行成功"
})()
"""

url = "http://localhost:12080/execjs"
data = {
    "group": "zzz",
    "name": "hlg",
    "jscode":jscode
}
res = requests.post(url, data=data)
print(res.text)

1

1

无参获取值

前端注入:

// 注册一个方法 第一个参数hello为方法名,
// 第二个参数为函数,resolve里面的值是想要的值(发送到服务器的)
demo.regAction("hello", function (resolve) {
    //这样每次调用就会返回“好困啊+随机整数”
    var Js_sjz = "好困啊"+parseInt(Math.random()*1000);
    resolve(Js_sjz);
})

请求http://localhost:12080/go?group=zzz&name=hlg&action=hello查看JS执行结果:
1

带参获取值

//写一个传入字符串,返回base64值的接口(调用内置函数btoa)
demo.regAction("hello2", function (resolve,param) {
    //这样添加了一个param参数,http接口带上它,这里就能获得
    var base666 = btoa(param)
    resolve(base666);
})

1

带多个参获 并且使用post方式 取值

//假设有一个函数 需要传递两个参数
function hlg(User,Status){
    return User+"说:"+Status;
}

demo.regAction("hello3", function (resolve,param) {
    //这里还是param参数 param里面的key 是先这里写,但到时候传接口就必须对应的上
    res=hlg(param["user"],param["status"])
    resolve(res);
})

1

sekiro

说明文档

构建

在Linux或者mac上,执行脚本 build_demo_server.sh,之后得到产出发布压缩包:sekiro-service-demo/target/sekiro-release-demo.zip
如果是windows,或者不想自己构建,可以在这里直接下载。
运行客户端:
1

注入服务端代码

Sekiro代码:https://sekiro.virjar.com/sekiro-doc/assets/sekiro_web_client.js

function guid() {
    function S4() {
        return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
    }

    return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
}

var client = new SekiroClient("ws://127.0.0.1:5620/business-demo/register?group=rpc-test&clientId=" + guid());

client.registerAction("encrypt", function(request, resolve, reject) {
    resolve(encrypt(request["data"]));
})

这里SekiroClient是用来与客户端交互的类,第一个参数是WS链接,其中group是业务分组,clientId是分组中的客户端ID。
registerAction用来注册事件,这里是encrypt。
request用来获取客户端发送来的数据,resolve用来返回客户端数据,通过request和resolve事件数据传输交互。

执行

下图是触发rpc-test业务分组的encrypt事件,传输数据abc,返回abc的加密数据。
1

完整代码:

(function () {
    var newElement = document.createElement("script");
    newElement.setAttribute("type", "text/javascript");
    newElement.setAttribute("src", "https://sekiro.virjar.com/sekiro-doc/assets/sekiro_web_client.js");
    document.body.appendChild(newElement);

    window.encrypt= encrypt // 设置成全局函数,避免未定义

    function guid() {
        function S4() {
            return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
        }
        return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
    }

    function startSekiro() {
        var client = new SekiroClient("ws://127.0.0.1:5620/business-demo/register?group=rpc-test&clientId=" + guid());

        client.registerAction("encrypt", function (request, resolve, reject) {
            resolve(window.encrypt(request["data"]));
        })
    }

    setTimeout(startSekiro, 2000) // 等待Document加载完成
})();

参考

https://segmentfault.com/a/1190000041440864
https://github.com/jxhczhl/JsRpc
https://github.com/virjar/sekiro

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/10114.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Spring Boot】Day03

文章目录一、Value和ConfigurationProperties的区别二、PropertySource一、Value和ConfigurationProperties的区别 区别: 数据校验:判断数据是否合法 Value: 不支持数据校验ConfigurationProperties:支持数据校验 开启数据校验功能&#xf…

软考证书可积分落户、评职称、抵扣个税等,快来考一个吧!

很多人想要在工作的城市落户、买房、生活、小孩上学,但由于对于城市落户政策不了解,担心自己条件不够!今天给大家介绍一本软考证书帮你解决落户等问题。 软考,是由国家人力资源和社会保障部、工业和信息化部领导下的国家级考试;既…

[附源码]java毕业设计价格公示系统

项目运行 环境配置: Jdk1.8 Tomcat7.0 Mysql HBuilderX(Webstorm也行) Eclispe(IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持)。 项目技术: SSM mybatis Maven Vue 等等组成,B/S模式 M…

C. Bouncing Ball(从后往前的前缀和)

Problem - 1415C - Codeforces 你正在为某个手机游戏创建一个游戏关卡。这个关卡应该包含一些从左到右排列的单元格,并以从1开始的连续整数编号,在每个单元格中,你可以放一个平台,也可以让它空着。 为了通过一个关卡,…

牛客网-《刷C语言百题》第四期

✅作者简介:嵌入式入坑者,与大家一起加油,希望文章能够帮助各位!!!! 📃个人主页:rivencode的个人主页 🔥系列专栏:《C语言入门必刷百题》 &#x…

QStyleFactor和QPalette

Qt中的分格都继承自QStyle,QStyle类是一个抽象基类,封装了一个GUI的外观。 QStyle常见的子类有: QStyleFactory类QPalette类QStyleFactor类 函数为: create()创建并返回与给定键匹配的QStyle对象keys()返回有效键的列表 获取有…

面试灵活拷问:对于数据库的索引,你是怎么理解的?

文章目录一、索引的概念及作用概念作用二、索引的应用场景三、索引的相关语法1.查询索引2.创建索引3.删除索引注意四、索引背后的数据结构什么是B树B树有什么特点采用B树结构能为索引带来什么好处五、索引的分类1.唯一索引(unique键对应的字段)2.主键索引…

Selenium基础 — 拓展:使用浏览器加载项配置实现用户免登陆

1、什么是加载项配置 在很多情况下,我们在登录网站的时候,浏览器都会弹出一个是否保存登录账号的信息。如果我们选择保存,那么我们在下次登录时就不用再次输入账号,直接免登录了。 在我们实际的测试过程中,测试注册登…

系统运维利器,百万服务器运维实战总结!一文了解最新版SysAK|龙蜥技术

在刚刚结束的龙蜥峰会 eBPF & Linux 稳定性专场上,龙蜥系统运维 SIG Maintainer 张毅做了《SysAK 系统运维工具集》的主题演讲,以下为演讲实录。 大家好,在去年的云栖大会,我们在龙蜥社区开源了系统运维工具集 SysAK&#xff…

new Vue的时候到底做了什么

Vue加载流程 1.初始化的第一阶段是Vue实例也就是vm对象创建前后:首先Vue进行生命周期,事件初始化发生在beforeCreate生命周期函数前,然后进行数据监测和数据代理的初始化,也就是创建vm对象的过程,当vm对象创建完成就可…

【Linux】gcc的使用

文章目录一、前言二、gcc的基本使用1. 预处理2. 编译3. 汇编4. 链接三、函数库四、gcc常用选项总结一、前言 在学习本文前,我们先简单回顾一下源代码被转换为可执行的机器指令的每个过程: 预处理(进行宏替换)编译(生成汇编)汇编…

windows什么录屏软件好用,windows屏幕录制软件

大部分人的电脑都是windows电脑,所以很多人都在找适合windows系统的录屏工具,windows什么录屏软件好用?我们到底该选择哪个录屏工具呢?今天我们就来给大家介绍windows版本的录屏工具。 一、易我录屏助手 这个工具很多人都比较熟悉…

艾美捷人重组MEGACD40L蛋白(可溶性)实例展示

艾美捷人重组MEGACD40L蛋白(可溶性)是一种高活性蛋白质,其中两个三聚体CD40配体分子通过脂联素/ACRP30/AdipoQ的胶原结构域人工连接。这种蛋白质非常有效地模拟体内CD40L的自然膜辅助聚集。 艾美捷人重组MEGACD40L蛋白(可溶性&…

openEuler快速入门(二)-openEuler命令行基础操作

系列文章目录 第一章 openEuler快速入门(一)-openEuler操作系统介绍 文章目录系列文章目录前言一、shell是什么二、Linux命令行操作技巧三、基础命令3.1、Linux命令分类3.2、目录和文件3.2.1 相对路径和绝对路径3.2.2 处理目录的常用命令ls:cd:pwd&…

供应N3-PEG-COOH,Azide-PEG-acid,叠氮-聚乙二醇-羧基可增加溶解度

一:产品描述 1、名称 英文:Azide-PEG-acid,N3-PEG-COOH 中文:叠氮-聚乙二醇-羧基 2、CAS编号:N/A 3、所属分类:Azide PEG Carboxylic acid PEG 4、分子量:可定制,1000、2000、…

搭建Redis -Sentinel架构

准备服务器 master节点:192.168.1.121 从节点1:192.168.1.122 从节点2:192.168.1.123 安装详细步骤 1、下载安装包 https://redis.io/download/ 2、进入工作目录 $cd /home 3、解压安装包 $tar -zxvf redis-6.2.6.tar.gz 4、建立软连接 $l…

OpenCV_06 图像平滑:图像噪声+图像平滑+滤波

文章目录1 图像噪声1.1 椒盐噪声1.2 高斯噪声1.3 瑞利噪声1.4 伽马噪声1.5 指数噪声1.6 均匀噪声2 滤波器2.1 均值滤波器2.1.1 算数平均值滤波器2.1.2 几何均值滤波器2.1.3 谐波平均滤波器2.1.4 反谐波平均滤波器2.2 统计排序滤波器2.2.1 中值滤波器2.2.2 最大值滤波器2.2.3 最…

翻开spring源码横看竖看,满屏只有四个字,看不懂啊。幸好我有大神的深度剖析spring源码,轻松看懂

前言 有一天,我翻开源码横看竖看,满屏只看到四个字,我看不懂啊。 所以是不是曾和我一样迷失在毫无头绪的源码里,在各种类和方法里翻山越岭,却如同管中窥豹。是的话,要不今晚早点睡? 呸&#x…

前端学习路线(二)

在前端学习路线(一)一章中我们讲了关于前端三剑客和jq与js的问题,并且简要的说明了js高级是什么,那在本章节我们主要从如何学习js高级开始进行讲述,并对es6如何学习,bootstrap学不学和学什么,并…

Tomcat部署及优化

目录 一. Tomcat的介绍 1.2 Tomcat核心组件 1.2.1 核心组件的作用 1.3 servlet简介 1.4 JSP介绍 1.5 Tomcat功能组件结构 1.6 Tomcat请求过程 二.Tomcat服务部署 2..2 安装JDK​编辑​编辑​编辑 2.3 设置JDK环境变量​编辑​编辑 2.5 优化tomcat启动速度 2.6 tom…