什么更好?使用iframe或jQuery之类的东西在外部网站中加载HTML文件

what is better? using iframe or something like jquery to load an html file in external website

本文关键字:外部 网站 文件 HTML 加载 使用 更好 iframe jQuery 什么      更新时间:2023-09-26

我希望我的客户在我的 Web 应用程序上创建他们自己的 HTML,并将我的代码复制并粘贴到他们的网站上,以自定义大小在位置显示结果,并在页面中显示他们想要的其他选项。 我的 Web 应用程序的输出 HTML 包含 HTML 标记和 JavaScript 代码(例如,使用 JavaScript 创建的 Web 图表(。

我为此找到了两种方法。 一种使用 iframe,两种使用 jquery .load() .

什么更好更安全?还有其他办法吗?

iframe更好 - 如果您正在运行Javascript,那么该脚本不应在与用户站点相同的上下文中执行:您在这里要求用户不需要同意的信任级别,并且您的代码都经过了很好的沙盒处理,因此您不必担心父文档的样式和脚本。

作为前端Web开发人员和网站管理员,我经常自己决定在iframe中对第三方代码进行沙盒处理。以下是我这样做的一些原因:

  • 脚本将与文档的 DOM 一起播放。曾经,第三方小部件主动为IE引入了错误和性能密集型的PNG修复技巧,用于我们网站上img标签和CSS中使用的每个PNG。
  • 许多脚本会覆盖全局onload事件,从而抢走其他脚本的初始化触发器。
  • 读取本地会话信息并将其发送回自己的存储库。
  • 加载任意数量的资源并执行 CPU 密集型进程,中断和削弱我网站的核心体验。

以上都是第三方短视或恶意的例子,你可能认为自己如上所述,但关键是,作为你服务的用户之一,我不应该赌博。如果我把你的代码放在iframe中,我知道它可以愉快地做自己的事情,而不是搞砸我的网站或其用户。我还可以选择将加载和执行延迟到我选择的时刻(通过在选择的时刻动态加载 iframe(。

从您的便利性而不是用户的便利性的角度来论证这一点:

  • 您不必担心与XSS相关的任何信任问题。您可以诚实地告诉您的用户,他们不会通过运行您的工具让自己面临任何不必要的担忧。
  • 您不必付出额外的努力来规避CSS和JS对用户网站的影响。