Safari 17.6 中的 WebKit 功能

2024 年 7 月 29 日

作者：Jen Simmons

本次 Safari 更新是 Safari 17.x 的第七个版本。Safari 17.6 包含一项新功能和七项错误修复，旨在将重要的更改立即提供给您的用户。

Flexbox 中的安全对齐

在 WWDC 上宣布并首次出现在 Safari 18 beta 中的 Flexbox 对齐的 safe 关键字现已在 Safari 17.6 的 WebKit 中推出。这提供了一种机制来优化弹性项目的溢出方式。让我们看一个简单导航菜单的示例——Flexbox 的经典用法。

<nav aria-label="main"><ul>
  <li><a href="/us">U.S.</a></li>
  <li><a href="/business">Business</a></li>
  <li><a href="/investigations">Investigations</a></li>
  <li><a href="/style">Style</a></li>
  <li><a href="/tech">Tech</a></li>
  <li><a href="/world">World</a></li>
</ul></nav>

以下 CSS 创建了一个简单的布局，当一行上没有足够的空间容纳菜单时，它会换行，同时将项目在可用空间中居中。

header nav {
  display: flex;
  flex-flow: wrap;
  gap: 1.5rem;
  justify-content: center; /* centers the items in the available space */
}

A simple menu of links, each represented by a word, laid out in two lines of centered text.

默认情况下，justify-content: center 始终会使项目居中，即使内容溢出包含框也是如此。但是，您可能更希望内容在溢出时不居中——居中会截断单词的开头和结尾，当溢出不可见时，这会使内容更难理解。

Diagram showing the difference between safe and default layout of the same menu, when the space for it is so narrow every word in on its own line, and some of the long words start to get chopped off. — 在此演示中，比较不带 `safe` 关键字和带 `safe` 关键字的 `justify-content: center`。

safe 关键字允许您更改内容溢出时对齐的工作方式。justify-content: safe center 规则将改为对齐任何溢出的项目，同时继续居中那些未溢出的项目。

如果要覆盖 safe 关键字，可以使用 unsafe。justify-content: unsafe center 规则将执行与 justify-content: center 相同的操作。unsafe 关键字已经在 WebKit for Safari 中支持了相当长一段时间。

错误修复

WebKit for Safari 17.6 包含了对现有功能的完善工作。

媒体

修复了页面加载时为 <audio> 和 <video> 触发 loadeddata 事件的问题。(124079735) (FB13675360)
修复了使用 AudioWorklets 时发生的多种音频失真情况。(128551401)

PDF

修复了 PDF 预览在左上角显示过小的问题。(125796665)

渲染

修复了在末端对齐的弹性容器中内容溢出弹性项目时滚动的问题。(131201271)

Safari 网页扩展

修复了 Safari 网页扩展后台页面在大约 30 秒后停止响应的问题。(127681420)

网页检查器

修复了在“开发”菜单中显示来自 iOS 设备的额外 Safari 标签页的问题。(124876362)

WebRTC

修复了 WKWebView 中的 navigator.mediaDevices.getDisplayMedia() 问题。(128988615)

更新到 Safari 17.6

Safari 17.6 适用于 iOS 17.6、iPadOS 17.6、macOS Sonoma 14.6、macOS Ventura、macOS Monterey 以及 visionOS 1.3。

如果您正在运行 macOS Ventura 或 macOS Monterey，您可以单独更新 Safari，而无需更新 macOS。在 macOS Ventura 上，前往  > 系统设置 > 通用 > 软件更新，然后点击“可用更新”下的“更多信息…”。

要在 iPhone、iPad 或 Apple Vision Pro 上获取最新版本的 Safari，请前往“设置”>“通用”>“软件更新”，然后轻点更新。

反馈

我们喜欢倾听您的声音。要分享您对 Safari 17.6 的看法，请在 Mastodon 上找到我们：@jensimmons@front-end.social 和 @jondavis@mastodon.social。或者在 X 上向 @webkit 发送回复。您也可以在 LinkedIn 上关注 WebKit。如果您遇到任何问题，欢迎您就 Safari UI 提供反馈（了解更多关于提交反馈的信息），或者提交关于网页技术或网页检查器的WebKit 错误报告。如果您发现某个网站在 Safari 中似乎无法正常工作，但在其他浏览器中正常，请在webcompat.com 提交报告。提交问题确实会带来改变。

下载 macOS 上最新的 Safari 技术预览版，以保持在网页平台的最前沿并使用最新的网页检查器功能。

您也可以在Safari 17.6 发布说明中找到此信息。