有什么方法可以在浏览器中使用跨源字体构建 svg 吗？
Is there any way to build svg with cross-origin fonts in browser?
我正在尝试找到一种方法来在客户端制作 DOM-node 的屏幕截图。我想到的最佳选择是将 DOM-node 包装在 <foreignObject> 中并将其放置到 SVG 中。然后 SVG 转到 canvas 然后它可以转换为所有其他格式作为 Blob.
除字体外一切正常。自定义字体仅适用于内联 SVG，但不适用于作为单独文件的 SVG。我需要将它们作为 Blob 嵌入。
问题来了：其中一些字体托管在 Google 字体上，因此由于 CORS 限制，无法在运行时获取它们的 blob。
我已经尝试过 html2canvas 库，但它对我的目的来说并不可靠。 dom-to-canvas 和 html-to-canvas 相同。他们没有解决字体问题。
此外，我还尝试栅格化 DOM 节点中的所有子文本块，但结果远非完美。
服务器端解决方案是可行的，但我想避免它。
我错过了什么吗？
所以我想出了在我的服务器上创建代理来获取 cors 字体和 css。
我检查样式字体导入的样式和字体规则，并为带有嵌入字体和样式的 svg 创建新的规则。
我正在尝试找到一种方法来在客户端制作 DOM-node 的屏幕截图。我想到的最佳选择是将 DOM-node 包装在 <foreignObject> 中并将其放置到 SVG 中。然后 SVG 转到 canvas 然后它可以转换为所有其他格式作为 Blob.
除字体外一切正常。自定义字体仅适用于内联 SVG，但不适用于作为单独文件的 SVG。我需要将它们作为 Blob 嵌入。
问题来了：其中一些字体托管在 Google 字体上，因此由于 CORS 限制，无法在运行时获取它们的 blob。
我已经尝试过 html2canvas 库，但它对我的目的来说并不可靠。 dom-to-canvas 和 html-to-canvas 相同。他们没有解决字体问题。
此外，我还尝试栅格化 DOM 节点中的所有子文本块，但结果远非完美。
服务器端解决方案是可行的，但我想避免它。
我错过了什么吗？
所以我想出了在我的服务器上创建代理来获取 cors 字体和 css。
我检查样式字体导入的样式和字体规则，并为带有嵌入字体和样式的 svg 创建新的规则。