【例子1】通过油猴脚本让edge浏览器中2个不同页面与aardio的WebSocket交互通讯的例子-精品资源-Aardio资源网

【例子1】通过油猴脚本让edge浏览器中2个不同页面与aardio的WebSocket交互通讯的例子

finn 2023-10-11 1289

为了解决跨域问题做的例子。今天动脑一天的结果，还是不熟悉js和chrrome

第一步建立一个网页，主体就一个iframe

Code HTML/XTMLLine:6复制
	1.
2.
3.
4.
5.
6.
<body>
    <div class="container">
 <iframe src="https://aardio.com" width="900" height="800">
 </frame>
    </div>
</body>

第二步写2个脚本，对应2个网址一个index一个iframe

index页面的脚本，主要通过按键发送ws消息给aar服务器，接受来自服务器的消息

Code JavaScriptLine:28复制
	1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
// ==UserScript==
// @name         index
// @match        这里写你自己网址或者*://*
// @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant        none
// ==/UserScript==
console.log("index注入成功")
var socket = new WebSocket('ws://localhost:8876/aardio');
    // 连接打开时发送消息
    socket.onopen = function() {
        console.log("index连接到ws")
        socket.send('index连接到ws');
    };
    // 接收到消息时的处理
    socket.onmessage = function(event) {
        console.log('来自iframe的消息:', event.data);
    };
window.addEventListener('keydown', function(event) {
    if (event.key === 'Control') { // 按下 Ctrl 键时触发ws
        socket.send("iframe提取内容");
    }
});

iframe页面的脚本，接受来自aar服务器的命令进行操作，比如提取网页的内容

Code JavaScriptLine:27复制
	1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
// ==UserScript==
// @name         iframe
// @match        https://aardio.com/*
// @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant        none
// ==/UserScript==
console.log("iframe注入成功")
var socket = new WebSocket('ws://localhost:8876/aardio');
// 连接打开时发送消息
socket.onopen = function() {
    console.log("iframe连接到ws")
    socket.send('iframe连接到ws');
};
// 接收到消息时的处理
socket.onmessage = function(event) {
    console.log('来自主页面的消息:', event.data);
    if(event.data==='iframe提取内容'){
    //提取aardio网站的内容
    var text=document.querySelector("#main-content > section.section.services > div > astro-island > div > div.mt-6.lg\\:col-5.lg\\:order-1.lg\\:mt-0 > div > h3").textContent
    console.log('提取到的文本:'+text)
    socket.send('提取到的文本:'+text);
    }
};

第三步建立一个aar的ws服务器

代码抄自例子，第一次写ws见谅。。写的有点蠢

Code AardioLine:69复制
	1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
//异步服务端
import win.ui;
/*DSG{{*/
var winform = win.form(text="WebSocket单线程异步服务端演示";left=10;top=4;right=774;bottom=467)
winform.add(
txtMessage={cls="edit";left=29;top=22;right=741;bottom=432;db=1;dl=1;dr=1;dt=1;edge=1;multiline=1;z=1}
)
/*}}*/
import web.socket.server;
var wsrv = web.socket.server();
//客户端使用HTTP请求切换到WebSocket协议
wsrv.onUpgradeToWebsocket = function(hSocket,request,response,protocol,origin){
    if( request.path!="/aardio"){
        //关闭应答即可拒绝请求 调用response.close()也可以
        return response.errorStatus(404);
    }
}
//一个客户端连接过来了
wsrv.onOpen = function(hSocket){ 
    var client = wsrv.client(hSocket);
    if(client)  winform.txtMessage.print( client.getRemoteIp() );
}
var iframe
var index
//一个客户端发消息过来了
wsrv.onMessage = function(hSocket,msg){
    winform.txtMessage.print(hSocket,msg.data); 
    //wsrv.send(hSocket,"WebSocket客户端，收到了你发过来的消息：" + msg.data)
     
    //把iframe的连接设为变量 
    if(msg.data="iframe连接到ws"){
        iframe=hSocket
    }
    
    //把index的连接设为变量 
    if(msg.data="index连接到ws"){
        index=hSocket
    }    
    //index发送命令，转给iframe  
   if(msg.data="iframe提取内容"){
           wsrv.send(iframe,"iframe提取内容")        
   }  
   
   //发送结果给index
    if( string.indexAny(msg.data,"提取到的文本")){
        wsrv.send(index,msg.data)        
   }  
    
}
//启动服务端 
if( wsrv.start(,8876) ){
    winform.txtMessage.print( wsrv.getUrl() + "/aardio","已启动WebSocket服务器");
    winform.txtMessage.print( wsrv.httpServer.getUrl(),"已启动HTTP服务器");
}
else {
    winform.txtMessage.print("启动失败，建议修改端口号")    
}
winform.show() 
win.loopMessage();