Question

我在标签<style amp-custom>中嵌入了一个自定义字体，就像这样

@font-face{
    font-family:font-icon;
    src: 
    url('https://example.com/skin/frontend/base/default/css/plumrocket/pramp/icon.ttf') format('truetype');
}

当我通过?amp=1查看网站时，此功能正常，但当我使用cdn网址cdn.ampproject.org/c/s/example.com时，字体无法加载。

当我检查源代码中的完整网址时，它变为/r/s/example.com/skin/frontend/base/default/css/plumrocket/pramp/icon.ttf，我认为这是正确的，因为字体应该被视为资源。

我尝试访问该字体的完整cdn网址，然后返回404.

Ex：https://example-com.cdn.ampproject.org/r/s/example.com/skin/frontend/base/default/css/plumrocket/pramp/icon.ttf

但是当我将r/s更改为c/s时，字体会返回200，这很奇怪，因为c/s应该是文档。

任何想法为什么AMP将我的字体视为文档而不是资源？

更新

我能解决这个问题，我只是将skin/frontend/base/default/css/icon.ttf内的字体文件移到skin/frontend/base/default/fonts/icon.tff。

我认为AMP读取文件目录以确定该文件在将其缓存到CDN URL时是content还是resources，并且因为我的第三方模块将字体文件放在一个目录中css/然后AMP将其解释为内容。

Answer 1

尝试使用您的模块创建这样的功能

public function __construct(
    \Magento\Framework\View\Element\Template\Context $context
) {
    parent::__construct($context);
}

/**
 * Retrieve view url without cdn url
 * @param  string $file
 * @param  array  $params
 * @return string
 */
public function getAmpSkinUrl($file = null, array $params = array())
{
    $url = $this->getViewFileUrl($file, $params);
    $fontInfo = parse_url($url);
    $baseInfo = parse_url($this->getUrl());
    $url = str_replace($fontInfo['host'], $baseInfo['host'], $url);

    return $url;
}

在你的情况下，你需要写这样的东西

@font-face{
font-family:font-icon;
src: 
url('<?php echo $this->getAmpSkinUrl('css/plumrocket/pramp/icon.ttf', array('_secure'=>true)); ?>') format('truetype');}

AMP - 自定义字体未加载到CDN网址

1 个答案: