Spaces:
Running
Running
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<title>Parent Page with Gradio Embed</title> | |
<style> | |
body, html { | |
margin: 0; | |
padding: 0; | |
height: 100vh; | |
width: 100vw; | |
overflow: hidden; | |
} | |
iframe { | |
width: 100%; | |
height: 100%; | |
border: none; | |
display: block; | |
} | |
</style> | |
</head> | |
<body> | |
<!-- Embed the Gradio app in an iframe --> | |
<iframe | |
id="gradioFrame" | |
src="https://e4d417385887b7e801.gradio.live" | |
sandbox="allow-same-origin allow-scripts allow-modals allow-popups allow-popups-to-escape-sandbox allow-top-navigation-by-user-activation" | |
allow="clipboard-write"> | |
</iframe> | |
<script> | |
// 监听来自iframe的消息 | |
window.addEventListener("message", (event) => { | |
if (event.data && event.data.type === "request_parent_url") { | |
event.source.postMessage({ | |
type: "parent_url", | |
url: window.location.href | |
}, event.origin); | |
} | |
// 添加对链接点击事件的处理 | |
if (event.data && event.data.type === "link_click") { | |
window.open(event.data.url, '_blank'); | |
} | |
}); | |
// 在iframe加载完成后注入脚本 | |
document.getElementById('gradioFrame').onload = function() { | |
try { | |
const frame = document.getElementById('gradioFrame'); | |
frame.contentWindow.postMessage({ | |
type: "inject_script", | |
script: ` | |
document.addEventListener('click', function(e) { | |
const link = e.target.closest('a'); | |
if (link) { | |
e.preventDefault(); | |
window.parent.postMessage({ | |
type: 'link_click', | |
url: link.href | |
}, '*'); | |
} | |
}); | |
` | |
}, '*'); | |
} catch(e) { | |
console.error('Failed to inject script:', e); | |
} | |
}; | |
</script> | |
</body> | |
</html> |