Question

要使用@ font-face。

来访问我的字体

@font-face {
    font-family: 'Brandon Grotesque Regular';
    src: url('http://server/font/brandon_reg-webfont.eot');
    src: url('http://server/font/brandon_reg-webfont.eot?#iefix') format('embedded-opentype'),
         url('http://server/font/brandon_reg-webfont.woff2') format('woff2'),
         url('http://server/font/brandon_reg-webfont.woff') format('woff'),
         url('http://server/font/brandon_reg-webfont.ttf') format('truetype'),
         url('http://server/font/brandon_reg-webfont.svg#brandon_grotesque_regularRg') format('svg');
    font-weight: normal;
    font-style: normal;
}

不幸的是，我无法访问我的字体，我的请求已被CORS政策阻止。

访问字体＆＃39; http://server/font/brandon_blk-webfont.woff2＆＃39; 来自原产地＆＃39; http://server.fr＆＃39;已被CORS政策阻止： No＆＃39; Access-Control-Allow-Origin＆＃39;标题出现在请求的上资源。起源＆＃39; http://localhost:8888＆＃39;因此是不允许的访问。

所以我编辑.htaccess

AddType application/vnd.ms-fontobject .eot
AddType font/ .ttf
AddType font/ .eot
AddType font/ .otf
AddType font/ .woff
AddType font/ .woff2
<FilesMatch ".(ttf|otf|eot|woff|woff2)">
<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>
</FilesMatch>

它也没有用。有什么想法吗？

Answer 1

这是解决方案：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script>
    $(function () {
    bindButtonClick();
    });

    function bindButtonClick() {
    $("#btnSubmit").on("click", function () {
    deleteDocument();
    });
    }

    function deleteDocument() {
    var siteUrl = _spPageContextInfo.webAbsoluteUrl;
    var webRelUrl = _spPageContextInfo.webServerRelativeUrl;
    var fullUrl = siteUrl + "/_api/web/GetFileByServerRelativeUrl('" + webRelUrl + "/DocLib/" + "Test5.txt" + "')";

    $.ajax({
    url: fullUrl,
    type: "POST",
    headers: {
    "accept": "application/json;odata=verbose",
    "content-type": "application/json;odata=verbose",
    "X-RequestDigest": $("#__REQUESTDIGEST").val(),
    "X-HTTP-Method": "DELETE",
    "IF-MATCH": "*"
    },
    success: onQuerySucceeded,
    error: onQueryFailed
    });
    }

    function onQuerySucceeded() {
    $("#divResults").html("Document successfully deleted!");
    }

    function onQueryFailed(sender, args) {
    alert("Error!");
    }
    </script>

将其放入服务器上放置字体的.htaccess文件中

如何通过CORS策略加载字体？

1 个答案: