我目前正在开发一个chrome扩展,它允许我下载网页上使用过的字体文件。
当我解析this site的字体时,我遇到了一个奇怪的字体URL的边缘情况。
对于字体Freddy
,@font-face
规则如下所示:
@font-face {
font-family: 'Freddy';
src: url("//cdn.shopify.com/s/files/1/0548/8708/8184/t/24/assets/freddy_regular_2-webfont.woff?v=147712666987587936441646682936") format("woff") ,
url("//cdn.shopify.com/s/files/1/0548/8708/8184/t/24/assets/Freddy_Regular_2.ttf?v=64870238297763773461646682938") format("truetype") ,
url("//cdn.shopify.com/s/files/1/0548/8708/8184/t/24/assets/freddy_regular_2-webfont.woff2?v=66678714148373221751646682937") format("woff2"); /* Safari, Android, iOS */}
这破坏了我的脚本,因为双斜杠使它成为一个无效的URL(即如果我把它按原样输入浏览器,它会给予我一个错误)。
所以我想知道-这个URL开头的双斜杠的目的是什么?如果字体看起来是一个无效的URL,那么它实际上是如何检索字体的呢?
1条答案
按热度按时间bxfogqkk1#
当引用另一个域上的内容时,以两个斜杠而不是
http
或https
协议开始的URL告诉浏览器使用与源页面相同的协议请求URL的内容(以防止mixed content)。这些URL并不意味着要输入到地址栏中,这就是为什么当您尝试直接导航到它时,它们看起来是无效的URL。