9

組み込みのMVC4バンドラーを使用して、CDN URLを生成するリンクタグの前に追加するにはどうすればよいですか？最初にリクエストされたときにウェブサーバーからアセットをプルするようにAmazonCloudfrontをセットアップしました。したがって、次のようにバンドルを定義すると、次のようになります。

 bundles.Add(new StyleBundle("~/Content/css").Include(
    "~/Content/reset.css",
    "~/Content/960_24_col.css",
    "~/Content/Site.css"
 ));

展開すると、次のように参照できます。

http://[cloundfrontid].cloudfront.net/Content/css?v=muhFMZ4thy_XV3dMI2kPt-8Rljm5PNW0tHeDkvenT0g1

ここで、バンドラーによって生成されたリンクを、CDNを指す絶対リンクに相対的なものから変更する必要があります。

  <link href="[INSERT_CDN_URL_HERE]/Content/css?v=muhFMZ4thy_XV3dMI2kPt-8Rljm5PNW0tHeDkvenT0g1" rel="stylesheet"/>

IBundleTransformを使用してパスを書き換えることは可能かもしれないと思いますが、この例は見つかりません。

注：明確にするために、バンドルのCDNリンクを指定できることは知っていますが、それはバンドルを静的リンクに置き換えることができる場合にのみ機能します。

4

2 に答える 2

6

MaxCDNをセットアップしたところ、まったく同じ問題が発生しました。

ご存知のようbundles.UseCdnに、バンドルの正確なURLを指定する必要がないため、このプロパティは理想的ではありません。Max CDNのようなCDNは、サブドメインが異なることを除いて、まったく同じURL、クエリ文字列、およびすべてです。

これが私がそれを解決することになった方法です。

BundleHelperrenderメソッドをラップし、パスの前にCDNサブドメインを追加するクラスを作成しました。

クラスは次のようになります。

namespace MyDomain.Web.Helpers
{
    public class BundleHelper
    {
        public static string CdnPath = "http://cdn.mydomain.com";

        public static IHtmlString RenderScript(string path)
        {
            var opt = System.Web.Optimization.Scripts.Render(path);
            string htmlString = HttpUtility.HtmlDecode(opt.ToHtmlString());

            if (BundleTable.EnableOptimizations)
            {
                htmlString = htmlString.Replace("<script src=\"/", String.Format("<script src=\"{0}/", CdnPath));
            }

            return new HtmlString(htmlString);
        }

        public static IHtmlString RenderStyle(string path)
        {
            var opt = System.Web.Optimization.Styles.Render(path);
            string htmlString = HttpUtility.HtmlDecode(opt.ToHtmlString());

            if (BundleTable.EnableOptimizations)
            {
                htmlString = htmlString.Replace("<link href=\"/", String.Format("<link href=\"{0}/", CdnPath));
            }

            return new HtmlString(htmlString);
        }
    }
}

次に、ビューで使用するには、次のようにします。

@BundleHelper.RenderStyle("~/Content/css")
@BundleHelper.RenderStyle("~/Content/themes/base/css")

@BundleHelper.RenderScript("~/bundles/jquery")
@BundleHelper.RenderScript("~/bundles/jqueryui")

お役に立てれば。

于 2013-06-11T22:23:09.130 に答える
1

「CDNの使用」で「 CDNの使用」を検索してください。

asp.net/mvcでRickAndersonが言ったように、

次のコードは、ローカルのjQueryバンドルをCDNjQueryバンドルに置き換えます。

    public static void RegisterBundles(BundleCollection bundles)
    {
    //bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
    //            "~/Scripts/jquery-{version}.js"));

    bundles.UseCdn = true;   //enable CDN support

    //add link to jquery on the CDN
    var jqueryCdnPath = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js";

    bundles.Add(new ScriptBundle("~/bundles/jquery",
                jqueryCdnPath).Include(
                "~/Scripts/jquery-{version}.js"));

    // Code removed for clarity.
    }

上記のコードでは、リリースモード中にCDNからjQueryが要求され、デバッグバージョンのjQueryがデバッグモードでローカルにフェッチされます。CDNを使用する場合、CDNリクエストが失敗した場合のフォールバックメカニズムが必要です。レイアウトファイルの最後にある次のマークアップフラグメントは、CDNが失敗した場合にjQueryを要求するために追加されたスクリプトを示しています。

    </footer>

        @Scripts.Render("~/bundles/jquery")

        <script type="text/javascript">
            if (typeof jQuery == 'undefined') {
                var e = document.createElement('script');
                e.src = '@Url.Content("~/Scripts/jquery-1.7.1.js")';
                e.type = 'text/javascript';
                document.getElementsByTagName("head")[0].appendChild(e);

            }
        </script> 

        @RenderSection("scripts", required: false)
    </body>
</html>

Asp.net/MVCからセクションを貼り付けました。便利な場合は、RickAndersonに乾杯してください...

于 2013-03-22T20:08:42.130 に答える