Unsafe JavaScript Attempt to Access Frame Warning in Safari-JavaScript中文网-JavaScript教程资源分享门户

在 Safari 浏览器中，开发人员有时会遇到一个警告信息：“Unsafe JavaScript attempt to access frame...”，这个警告信息通常是由于跨域访问导致的。

背景

Safari 浏览器实现了同源策略（Same-Origin Policy），即只允许来自同一域名、协议和端口的脚本进行交互。如果一个页面试图访问不同源的资源，浏览器就会报告一个错误并阻止脚本进一步运行。

但是，有些情况下我们需要在不同源之间进行数据交换或通信，这时候就需要使用跨域技术。

问题

在 Safari 浏览器中，当你使用跨域技术时，可能会遇到以下警告信息：

Unsafe JavaScript attempt to access frame with URL (URL1) from frame with URL (URL2). Domains, protocols and ports must match.

这个警告信息表明，来自一个域名的脚本试图访问另一个域名的内容。这种行为被认为是不安全的，并且会被浏览器拦截。

原因

这个警告信息通常出现在两个不同的域名之间进行跨域访问时。例如，你在一个来自 www.example.com 的网页中嵌入了一个来自 www.another.com 的 iframe，并且尝试从父页面中操作这个 iframe 中的 DOM 元素。

Safari 浏览器会检查两个页面之间的域名、协议和端口是否相同。如果不同，则会报告以上警告信息并拒绝访问。

解决方法

要解决这个问题，有以下几种方法：

1. 使用 postMessage

在父页面和 iframe 页面之间使用 postMessage 进行通信。这是一种安全的跨域通信方式，可以通过向目标窗口发送消息来实现数据交换或通信。以下是一个示例代码：

-- -------------------- ---- -------
-- ------ ----
----- ------ - ---------------------------------
----------------------------------------- ---------------------------

-- ------ ----
---------------------------------- ----- -- -
  -- ------------- --- -------------------------- -
    ------------------------ -- -----
  -
---

2. 在服务器端进行代理

使用服务器端脚本对请求进行代理，使其看起来像是来自同一域名。例如，在 PHP 中可以使用 cURL 库进行代理。以下是一个示例代码：

$url = 'https://www.another.com/api/data';
$ch = curl_init($url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_HEADER, false);
$data = curl_exec($ch);
curl_close($ch);

echo $data;

3. 在 iframe 中使用 sandbox 属性

在 iframe 中使用 sandbox 属性来限制其脚本的操作权限。这个属性可以设置为 allow-scripts，表示只允许 iframe 中的脚本进行一些基本的操作，例如点击和滚动等。以下是一个示例代码：

<iframe src="https://www.another.com" sandbox="allow-scripts"></iframe>

总结

在 Safari 浏览器中，跨域访问会导致警告信息“Unsafe JavaScript attempt to access frame...”。我们可以使用 postMessage、服务器端代理或者 iframe 的 sandbox 属性来解决这个问题。选择哪种方法要根据具体情况而定，但是需要注意安全性和可

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/29775