Question

我正在尝试使用电子创建桌面应用，但我无法加载任何外部网址，如google.com或任何其他内容。

当我在index.html中使用此代码时：

   <!DOCTYPE html>
  <html>
    <head>
      <meta charset="UTF-8">
      <title>Hello World!</title>
    </head>
    <body>
      <h1>Hello World!</h1>
      <!-- All of the Node.js APIs are available in this renderer process. -->
      <iframe src="http://www.w3schools.com"></iframe>


      <script>
        // You can also require other files to run in this process
        require('./renderer.js')
      </script>
    </body>
  </html>

我收到此错误：

  index.html:1 Refused to display 'https://www.w3schools.com/' in a frame because it set 'X-Frame-Options' to 'sameorigin'.
  www.w3schools.com/ Failed to load resource: net::ERR_BLOCKED_BY_RESPONSE

我的问题是我可以打开原子内的任何网址，如果是，那么当我将它作为桌面应用程序或安卓应用程序时它会起作用

Answer 1

这些天来，大多数网站阻止了其他人对其进行处理。正如您可以看到此错误，该网站仅允许来自同一域的iframe。作为替代方案，您可以使用Electron的webview标记，该标记在单独的线程上启动网站，在其自己的BrowserWindow中进行沙盒化。 https://electronjs.org/docs/api/webview-tag

Answer 2

添加到Sjoerd Dal已回答的内容中。

使用IFRAME添加外部URL：网站阻止将那里的网页添加到其他任何网页，以避免点击劫持。这通常通过以下方式完成：在标题中添加响应。这会阻止未列入白名单/来源不相同的页面将这些页面包含在iframe b中。检查顶部窗口是否与当前窗口相同。
现在可以回答您的问题，实际上有一种非常简单的方法可以做到：

const urls = [
    "https://www.google.com"
]

const createWindow = () =>{
    win = new BrowserWindow({
        center: true,
        resizable: true,
        webPreferences:{
            nodeIntegration: false,
            show: false
        }
    });
    win.maximize();
    win.webContents.openDevTools();
    //win.webContents.
    console.log(urls[0]);

    win.loadURL(urls[0]);
    // win.loadURL(url.format({
    //     pathname: path.join(__dirname,"index.html"),
    //     protocol: 'file',
    //     slashes: true
    // }));
    win.once('ready-to-show',()=>{
        win.show()
    });

    win.on('closed',()=>{
        win = null;
    });
}

app.on('ready', createWindow);

电子打开外部网址

2 个答案: