有没有办法用 web 组件嵌入和沙盒 web 页面

Question

I followed this link: https://sebastiandedeyne.com/embed-a-web-page-with-a-web-component-and-the-shadow-dom/ I expected to get an equal to sandbox javascript but but only get the static page witout javascript and css applied and dont get code if i use url version.我点击了这个链接： https://sebastiandedeyne.com/embed-a-web-page-with-a-web-component-and-the-shadow-dom/我希望得到一个等于沙箱 javascript 但只能得到static 页面没有 javascript 和 css 应用，如果我使用 url 版本，则不会获得代码。 How to do it properly?如何正确地做到这一点？

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>Simple template</title>
  <script src="main2.js" defer></script>
</head>

<body>
  <h1>Simple template</h1>
  <embedded-webview src="https://www.google.com/index.html"></embedded-webview>


</body>

</html>

main2.js file main2.js文件

class EmbeddedWebview extends HTMLElement {
    connectedCallback() {
    fetch(this.getAttribute('src'))
      .then(response => response.html())
      .then(html => {
        const shadow = this.attachShadow({ mode: 'closed' });
        shadow.innerHTML = html;
      });
  }
}
 
window.customElements.define(
  'embedded-webview',
  EmbeddedWebview
);

I'm expet to get an sandboxt to javascript. Maybe if anyone could recommend to me any already done webcomponent我很想得到一个沙盒到 javascript。也许如果有人可以向我推荐任何已经完成的 webcomponent

Answer 1

I'm using now an aproach that works.我现在正在使用一种有效的方法。 I'm usin an iframe with autoresize hability, starting with fullscreen resize.我正在使用具有自动调整大小功能的 iframe，从全屏调整大小开始。

有没有办法用 web 组件嵌入和沙盒 web 页面

问题描述

1 个解决方案

解决方案1
0 2023-01-19 10:36:02

有没有办法用 web 组件嵌入和沙盒 web 页面

问题描述

1 个解决方案

解决方案1 0 2023-01-19 10:36:02

解决方案1
0 2023-01-19 10:36:02