我如何从chrome开发人员工具下载/提取字体

Question

我已经厌倦了许多事情，但即使我的电脑有它，我也无法得到它。

我如何访问这些wont文件...它们是.woff扩展名。在chrome检查器中双击它们只需要一些URL。哪个不起作用。

我的计算机上也没有安装此字体。

这实际上是我生命中第一次遇到woff格式和概念Web开放格式。我想下载字体网站正在使用。我知道我可以下载图像为什么不会。

Answer 1

要获取 .woff 字体，请先打开chrome dev工具面板（Ctrl+Shift+i），然后转到网络并重新加载页面。在那里，您将看到页面下载的所有内容。找到.woff文件，右键单击，然后选择复制回复。

响应将是一个网址，因此将其粘贴到导航栏。将下载一个文件，只需将 .woff 扩展程序添加到其中即可。

Answer 2

右键单击，然后“在新选项卡中打开链接”

编辑：您也可以双击，它具有相同的效果

Answer 3

这很容易（仅适用于Chorme）

1. 右键单击＆gt;检查元素
2. 转到“资源”标签，在下拉文件夹中找到“字体”
   • 'Resouces'标签可称为'应用'
3. 右键点击字体（places%=items.Count;格式）＆gt;在新标签页中打开链接（这应该以{{1​​}}格式
下载字体
4. 在线查找'Woff to TTf or Otf'字体转换器
5. 转换后享受！

Answer 4

如果您使用的是unixoid操作系统并且只想提取单个文件，则可以尝试以下操作。 chrome://cache页面的结构是URL，解析的HTTP标头，HTTP标头的十六进制转储，然后是有效负载的十六进制转储。

要提取文件，请将Chrome缓存页中的所有有效内容行复制到剪贴板（从第00000000: ...行开始），将其粘贴到文本编辑器中并将其另存为纯文本文件（例如{{ 1}}）。如果有效负载是gzip压缩文件，请使用file.txt将其转换回二进制文件，并xxd -r file.txt > file.woff.gz进行解压缩。

然后，您可以使用woff2otf将WOFF文件转换为OTF格式或woff2将WOFF 2.0文件转换为TTF格式。对于批处理，这个工作流程显然应该是脚本化的。

Answer 5

我发现Chrome选项可以，但是要获取字体文件还有很多步骤。在那里，下载非常容易。由于步骤较少，我通常在Safari中使用开发工具。只需转到所需的页面，在“开发人员”菜单中单击“显示页面源代码”或“显示页面资源”（两者均可），页面资源列在左侧文件夹中。单击字体文件夹，然后列出字体。右键单击并保存文件。如果您要从一个站点下载许多字体文件，则通过“浏览选项卡”确实可以更快地下载字体，因此浏览Chrome途径的过程可能更快。如果您从许多不同的网站上获取一种或两种字体，那么Safari总体上会更快。

Answer 6

打开chrome

右键单击=>检查=>导航到应用标签

在框架部分中，列出了所有静态可用的资产（资源），例如css，JavaScript，字体。

Answer 7

尽管Marcelo的解决方案运行良好，但您可能根本不需要下载字体！ 只需远程链接。

例如，字体托管在 example.com 上，请

@font-face {
  font-family: "Font Name";
  font-style: normal;
  src: url(http://example.com/webfonts/font-name.woff);
}

您可以通过查看 example.com 中的CSS代码并查看它们如何链接文件来轻松找出字体的直接URL。

Answer 8

目前最好的方法

实际上是转到 rightclick: inspect > Application (on the top tabs) > Frames (scroll on the left tabs) 然后您可以找到一个 Font 部分，其中列出了所有加载的字体。它列出了以任何可能的安全方式加载的所有内容。

此外，它还可以在右侧预览它们，使其更容易

然后您可以右键单击您想要的并在新选项卡中打开。然后你可以在最后添加一个 .woff 并在任何地方使用它。 （您也可以在预览底部查看其扩展名）