archive/yaklang-chrome-extension
1
0
Fork 0
mirror of https://github.com/yaklang/yaklang-chrome-extension.git synced 2026-09-22 03:10:43 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

调用active tab js func

Browse Source
This commit is contained in:
go0p
2024-05-15 14:43:04 +08:00
committed by go0p
parent 0c8f82b441
commit e150379c7f
6 changed files with 99 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package.json
+1 -1
View File
@@ -9,7 +9,7 @@
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"ahooks": "^3.7.10",
"antd": "^5.15.3",
"antd": "^5.17.0",
"babel-jest": "^27.4.2",
"babel-plugin-named-asset-import": "^0.3.8",
"babel-preset-react-app": "^10.0.1",
public/background.js
+10 -11
View File
@@ -81,16 +81,15 @@ const pageFunction = (code) => {
// });
// });
// chrome.runtime.onConnect.addListener(function (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({action: "TEST POST MESSAGE"});
//
// });
chrome.runtime.onConnect.addListener(function (port) {
console.assert(port.name === "content-to-ex");
port.onMessage.addListener(function (msg) {
console.log("[content-to-ex]", msg)
});
port.onDisconnect.addListener(function () {
console.error("[content-to-ex] Disconnected from port.");
});
// port.postMessage({action: "TEST POST MESSAGE"});
});
public/content.js
+6 -5
View File
@@ -1,14 +1,15 @@
console.log("Loaded content.js")
window.addEventListener("message", (event) => {
if (event.data.type && (event.data.type === "TEST")) {
console.log(event)
const name = event.data.fn_name
const args = event.data.args
console.log(event)
if (event.data.yakitex.msg && (event.data.yakitex.msg.type === "TEST")) {
const name = event.data.yakitex.msg.fn_name
const args = event.data.yakitex.msg.args
const a = (fn, args) => {
return window[fn](args)
}
const zz = a(name, args)
console.log("res ", zz)
window.postMessage({type: "FROM_PAGE", text: zz}, "*")
}
}, );
},);
public/inject.js
+50 -49
View File
@@ -1,54 +1,55 @@
/**
* injectScript - Inject internal script to available access to the `window`
*
* @param {type} file_path Local path of the internal script.
* @param {type} tag The tag as string, where the script will be append (default: 'body').
* @see {@link http://stackoverflow.com/questions/20499994/access-window-variable-from-content-script}
*/
function injectScript(file_path, tag) {
const node = document.getElementsByTagName(tag)[0];
if (!node) {
console.error('The "' + tag + '" tag is not available in the document.');
return;
}
// 移除之前的脚本
const oldScript = document.getElementById('yakit-injected-script');
if (oldScript) {
node.removeChild(oldScript);
}
const script = document.createElement('script');
script.setAttribute('type', 'text/javascript');
script.setAttribute('src', file_path);
script.setAttribute('id', 'yakit-injected-script');
function injectScript(src, id, message) {
return new Promise((resolve) => {
// Inject a script tag into the page to access methods of the window object
const script = document.createElement('script')
node.appendChild(script);
script.onload = () => {
const onMessage = ({data}) => {
console.log(data)
if (!data.yakitex || !data.yakitex.msg) {
return
}
window.removeEventListener('message', onMessage)
resolve(data.yakitex.msg)
script.remove()
}
window.addEventListener('message', onMessage)
window.postMessage({
yakitex: message,
})
}
script.setAttribute('src', chrome.runtime.getURL(src))
document.body.appendChild(script)
})
}
// document.addEventListener('DOMContentLoaded', function () {
injectScript(chrome.runtime.getURL('content.js'), 'body');
chrome.runtime.onConnect.addListener(function (port) {
console.assert(port.name === "ex-to-content");
port.onMessage.addListener(function (msg) {
injectScript('content.js', 'sender', {yakitex: "123", id: "yakit", msg: msg}).then((res) => {
window.addEventListener("message", (event) => {
// if (event.source !== window) {
// return;
// }
if (event.data.type && (event.data.type === "FROM_PAGE")) {
console.log(event)
const port2 = chrome.runtime.connect({name: "content-to-ex"});
port2.postMessage(event.data.text);
port2.disconnect();
}
},);
const port = chrome.runtime.connect({name: "content-script"});
})
});
port.onDisconnect.addListener(function () {
console.error("Disconnected from port.");
});
port.onMessage.addListener(function (msg) {
console.log("我听到了成功的回响 :", msg);
window.postMessage(msg, "*")
});
window.addEventListener("message", (event) => {
// We only accept messages from ourselves
if (event.source !== window) {
return;
}
if (event.data.type && (event.data.type === "FROM_PAGE")) {
console.log(event)
console.log("Content script received: " + event.data.text);
if (port && port.postMessage) {
port.postMessage(event.data.text);
}
}
}, );
// });
port.onDisconnect.addListener(function () {
console.error("[ex-to-content] Disconnected from port.");
});
});
src/App.tsx
+2 -2
View File
@@ -17,8 +17,8 @@ function App() {
}}
>
<div className="App">
<Contro/>
<Proxifier/>
{/*<Contro/>*/}
{/*<Proxifier/>*/}
<Eval/>
<EvalInTab/>
src/components/EvalInTab.tsx
+30 -19
View File
@@ -10,26 +10,27 @@ export const EvalInTab: React.FC<EvalInTabProps> = () => {
const [inputData, setInputData] = useState("");
const [isScriptInjected, setIsScriptInjected] = useState(false);
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]);
const handleClick = async () => {
const tabId = await wsc.getTabId();
if (!isScriptInjected) {
chrome.scripting.executeScript({
target: {tabId: await wsc.getTabId()},
@@ -37,10 +38,20 @@ export const EvalInTab: React.FC<EvalInTabProps> = () => {
}).then(injectResults => {
console.log(injectResults)
setIsScriptInjected(true);
const port = chrome.tabs.connect(tabId, {name: "ex-to-content"})
port.postMessage({type: "TEST", fn_name: "Encrypt", args: inputData});
port.onMessage.addListener(function (msg) {
console.log(msg)
})
});
}
console.log("injected script")
const port = chrome.tabs.connect(tabId, {name: "ex-to-content"})
port.postMessage({type: "TEST", fn_name: "Encrypt", args: inputData});
port.onMessage.addListener(function (msg) {
console.log(msg)
})
};
const handleInputChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {