fix: 注入js

This commit is contained in:
song_xiao_lin
2024-05-15 14:43:04 +08:00
committed by go0p
parent a4840c9c5e
commit 7c1cdd562c
6 changed files with 120 additions and 173 deletions
+55 -63
View File
@@ -1,72 +1,64 @@
import React, {useEffect, useState} from "react";
import {Button} from "antd";
import React, { useEffect, useState } from "react";
import { Button } from "antd";
import TextArea from "antd/lib/input/TextArea";
import {wsc} from "@network/chrome";
import { wsc } from "@network/chrome";
import { ActionType } from "../../public/socket";
interface EvalInTabProps {
}
interface EvalInTabProps {}
export const EvalInTab: React.FC<EvalInTabProps> = () => {
const [inputData, setInputData] = useState("");
const [port, setPort] = useState<chrome.runtime.Port>()
const [inputData, setInputData] = useState("");
// useEffect(() => {
// // const onConnectListener = (port: chrome.runtime.Port) => {
// // console.assert(port.name === "content-script");
// // port.onMessage.addListener(function (msg) {
// // console.log("on connect", msg)
// // });
// // port.onDisconnect.addListener(function () {
// // console.error("Disconnected from port.");
// // });
// // port.postMessage({type: "TEST", fn_name: "Encrypt", args: inputData});
// // };
// //
// // chrome.runtime.onConnect.addListener(onConnectListener);
//
// // return () => {
// // chrome.runtime.onConnect.removeListener(onConnectListener);
// // };
// }, [inputData]);
// useEffect(() => {
// // const onConnectListener = (port: chrome.runtime.Port) => {
// // console.assert(port.name === "content-script");
// // port.onMessage.addListener(function (msg) {
// // console.log("on connect", msg)
// // });
// // port.onDisconnect.addListener(function () {
// // console.error("Disconnected from port.");
// // });
// // port.postMessage({type: "TEST", fn_name: "Encrypt", args: inputData});
// // };
// //
// // chrome.runtime.onConnect.addListener(onConnectListener);
//
// // return () => {
// // chrome.runtime.onConnect.removeListener(onConnectListener);
// // };
// }, [inputData]);
useEffect(() => {
const injectFun = async () => {
const tabId = await wsc.getTabId();
chrome.scripting.executeScript({
target: {tabId: tabId},
files: ['inject.js'],
}).then(() => {
const newPort = chrome.tabs.connect(tabId, {name: "ex-to-content"})
setPort(newPort)
newPort.onMessage.addListener(function (msg) {
console.log(msg)
})
})
}
injectFun()
return () => {
if (port) {
port.disconnect()
}
}
}, [])
useEffect(() => {
wsc.onWSCMessage((message) => {
if (message.action === ActionType.RESTOEVALINTAB) {
console.log("res:", message.result);
}
});
}, []);
const handleClick = async () => {
port.postMessage({type: "TEST", fn_name: "Encrypt", args: inputData});
};
const handleClick = async () => {
try {
const tabId = await wsc.getTabId();
chrome.runtime.sendMessage({
action: ActionType.INJECTSCRIPT,
tabId: tabId,
value: { fn_name: "Encrypt", args: inputData },
});
} catch (error) {}
};
const handleInputChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
setInputData(event.target.value);
};
const handleInputChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
setInputData(event.target.value);
};
return (
<div>
<TextArea
value={inputData}
onChange={handleInputChange}
placeholder="Enter your expression (e.g., 22 * 33)"
/>
<Button onClick={handleClick}>eval in tab me</Button>
</div>
);
}
return (
<div>
<TextArea
value={inputData}
onChange={handleInputChange}
placeholder="Enter your expression (e.g., 22 * 33)"
/>
<Button onClick={handleClick}>eval in tab me</Button>
</div>
);
};