function assistLoad(itemId) { // 页面为加载完毕就不断等待 if (!document.body) { setTimeout(() => { assistLoad() }, 500); return } // 创建div元素 const newDiv = document.createElement('div'); // 设置div的内容和属性 newDiv.id = 'assistBox'; newDiv.className = 'assist-box'; newDiv.innerHTML = ` `; newDiv.style.cssText = ` position: fixed; right: 0; bottom: 20px; border: 1px solid #ccc; background-color: rgba(255, 255,255, 0.8); z-index: 99; transition: right 1s ease; `; // 将div插入到body的末尾 document.body.appendChild(newDiv); // 创建 iframe 并插入页面 const iframe = document.createElement('iframe'); iframe.src = itemId ? `https://demos.run/assist/index-${itemId}.html` : 'https://demos.run/assist/index.html'; iframe.style.cssText = `width: 300px;height: 400px;border: none;` setTimeout(() => { window.assistBox.appendChild(iframe); }, 0); // 向 iframe 发送消息 iframe.onload = () => { iframe.contentWindow.postMessage({ type: "onload", value: location.href }, '*'); }; function sendCallBack(callBackID, value) { if (!event.data.callBackID) return iframe.contentWindow.postMessage({ type: "callBack", value, callBackID }, '*'); } // 发送和接收页面 const channel = new BroadcastChannel('tab_channel'); // 接收消息 channel.onmessage = function(event) { console.log('同源窗口消息:', event.data); if (event.data.type === 'assistTabMessage') { iframe.contentWindow.postMessage({ type: "assistTabMessage", value: event.data.value, url: location.href }, '*'); } }; // 接收子页面发来的消息 window.addEventListener('message', (event) => { // console.log('来自子页面的消息:', event.data); switch (event.data.type) { // assistMsg('click','#shi') case "click": if (typeof event.data.target === "string") { if (document.querySelector(event.data.target)) { document.querySelector(event.data.target).click() sendCallBack(event.data.callBackID, {"err": 0}) } else { sendCallBack(event.data.callBackID, {"err": 1, "msg": "元素不存在!"}) } } else { if (document.querySelectorAll(event.data.target[0])[event.data.target[1]]) { document.querySelectorAll(event.data.target[0])[event.data.target[1]].click() sendCallBack(event.data.callBackID, {"err": 0}) } else { sendCallBack(event.data.callBackID, {"err": 1, "msg": "元素不存在!"}) } } break; case "setValue": const domTemp = document.querySelector(event.data.target) if (domTemp) { domTemp.value = event.data.value // 触发 `input` 事件,让 Vue/React 或监听的代码能检测到变化 domTemp.dispatchEvent(new Event("input", { bubbles: true })); sendCallBack(event.data.callBackID, {"err": 0}) } else { sendCallBack(event.data.callBackID, {"err": 1, "msg": "元素不存在!"}) } break; // assistMsg('fetch', { // url: "https://obfuscator.lamp.run", // method: "POST", // body: "{\"code\":\"document.querySelector('.conn-box .show').innerHTML='gf'\"}", // redirect: "follow" // }) case "querySelectorAll": let returnList = [] let elTemp = null if (typeof event.data.value === "string") { elTemp = document.querySelectorAll(event.data.value) } else { elTemp = document.querySelectorAll(event.data.value[0]) } document.querySelectorAll(event.data.value).forEach(element => { let tempObj = { id: element.id, className: element.className, } if (typeof event.data.value === "object") { event.data.value[1].forEach(key => { if (element[key]) tempObj[key] = element[key] }); } returnList.push(tempObj) }); sendCallBack(event.data.callBackID, returnList) break; case "fetch": fetch(event.data.value.url, event.data.value.options) .then((response) => response.text()) .then((result) => { console.log(result) if (event.data.callBackID) { sendCallBack(event.data.callBackID, result) } }) .catch((error) => console.error(error)); break; case "closeWindow": window.close(); break; case "back": history.back(); break; case "localStorageGetItem": sendCallBack(event.data.callBackID, localStorage.getItem(event.data.value)) break; case "localStorageSetItem": localStorage.setItem(event.data.value[0], event.data.value[1]) break; case "removeAttribute": document.querySelectorAll(event.data.value[0]).forEach(element => { element.removeAttribute(event.data.value[1]) }); break; case "sendTabMessage": // 发送消息 channel.postMessage({type: 'assistTabMessage', value: event.data.value}); break; default: break; } }); } console.log('加载成功!')