谷歌字体 api 不起作用 asp.net mvc bundleconfig

Question

我目前正在开发一个 ASP.NET MVC 应用程序，我正在尝试在我的 bundleconfig.cs 中包含一个 google 字体。

不幸的是，它没有按预期工作。我收到此错误：

网址“https://fonts.googleapis.com/css?family=Rokkitt:200,300,400,700”无效。仅允许应用程序相对 URL (~/url)。 参数名称：虚拟路径

我当前在 BundleConfig.cs 的 RegisterBundles 方法中的编码如下所示：

    string[] libraryCssList = new string[] 
    {
       "~/Content/css1.css",
       "~/Content/css2.css",
    }; // works fine

    // error begins:

bundles.UseCdn = true;

    var fontRokkittCss = "https://fonts.googleapis.com/css?family=Rokkitt:200,300,400,700";

    bundles.Add(new StyleBundle("~/Content/libraryCss")
    .Include(libraryCss)
    .Include(fontRokkittCss));

你知道如何在 asp.net mvc 4 中将 google font api 包含到 bundle config 中吗？

谢谢！！

Answer 1

在RegisterBundles 方法中，必须将BundleCollection.UseCDN 成员变量设置为true。下面的例子，注意 Include 方法的使用（和不使用）：

public static void RegisterBundles(BundleCollection bundles) {
    bundles.UseCdn = true;

    // SCRIPTS
    const string boostrapCdnPath = "https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.0.0-beta3/js/bootstrap.bundle.min.js";
    bundles.Add(new ScriptBundle("~/bundles/bootstrap.bundle.min.js", boostrapCdnPath));
    bundles.Add(new ScriptBundle("~/bundles/someLocalScript").Include("~/scripts/someLocalScript.js"));

    // STYLES
    bundles.Add(new StyleBundle("~/bundles/GoogleOpenSans", "https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap"));
    bundles.Add(new StyleBundle("~/bundles/bootstrap.min.css", "https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.0.0-beta3/css/bootstrap.min.css"));
    bundles.Add(new StyleBundle("~/bundles/bootstrap-icons.min.css", "https://cdnjs.cloudflare.com/ajax/libs/bootstrap-icons/1.4.0/font/bootstrap-icons.min.css"));
}