Chrome Iframe“(站点名称)拒绝连接”错误

eit6fx6z  于 2023-08-01  发布在  Go
关注(0)|答案(3)|浏览(178)

我在项目中使用的iframe元素的内容是“(site name)refused to connect.”我得到了错误我如何修复这个错误?

<iframe src="https://www.google.com/" frameborder="0"></iframe>

字符串
https://jsfiddle.net/fatihege/2he1nuyf/

f0ofjuux

f0ofjuux1#

几个月来,我一直在努力解决这个问题,最后找到了一个非常简单的解决方案,我还没有看到任何人提到。如果你想使用iframe来包含一个不允许你这样做的网站,创建你自己的php文件,我把我的命名为iframe.php。在该文件中,放入以下内容:

<!DOCTYPE html><html><?php echo file_get_contents($_REQUEST['url']); ?></html>

字符串
然后,在您的iframe中,使用srcurl 'iframe.php?url=http:www.website.com'。

92dk7w1h

92dk7w1h2#

这不是你的代码,因为网站可以阻止自己被陷害。
这是因为mozilla文档中有一个特定的头集(X-Frame-Options):https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
</head>
<body>
  <iframe src="https://www.google.com/" frameborder="0"></iframe>
</body>
</html>

字符串
但是对于另一个域(example.com):

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
</head>
<body>
  <iframe src="https://www.example.com/" frameborder="0"></iframe>
</body>
</html>


在不允许您查看站点的情况下,您可以依靠服务器端来实现这一点。基本上,这个概念是服务器将获取文件并将其附加到给定的位置。
正如@Dale的回答所指出的,这可以用php来完成。对于那些使用其他服务器端语言的用户来说,基本上应用相同的原理。在node中的实现将类似于:

const express = require('express');
const fs = require('fs');
const { execSync } = require('child_process');
const app = new express();
const PORT = 3000;

const fetchWebsite = (url) => {
  execSync(`wget -q -O - ${url} > site.html`,
    (error, stdout, stderr) => {
      if (error !== null) {
        return false;
      }
  });
}

app.get('/', async (req, res) => {
  fs.writeFileSync('site.html', '', () => console.log('Created site.html'));
  fs.createReadStream('site.html').pipe(res);
  fetchWebsite('https://www.stackoverflow.com');
});

app.listen(PORT, () => {console.log("Listening at port: ", PORT)} )


当然,这假设您使用的是标准Linux服务器,并且安装了express模块。

1qczuiv0

1qczuiv03#

如果你需要用nestjs编写上面@scoochy的expressjs代码,这可能会有一点帮助

import { Controller, Get, Response } from '@nestjs/common';

import { execSync } from 'child_process';
import { createReadStream, writeFileSync } from 'fs';

@Controller('iframe')
export class IFrameController {
  fetchWebsite = (url) => {
    execSync(`wget -q -O - ${url} > site.html`);
  };

  @Get()
  getFile(@Response() res) {
    writeFileSync('site.html', '');
    createReadStream('site.html').pipe(res);
    this.fetchWebsite('https://www.stackoverflow.com');
  }
}

字符串

相关问题