1

Ich gründe sich wie folgt zusammen:Wie schreibe ich einen CDN-Fallback-Ausdruck beim asynchronen Laden eines Skripts? meine jQuery-Bundle

var bundle = new ScriptBundle("~/bundles/jquery", "//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"); 

// Path to the version of the file on your server (in case the CDN fails) 
bundle.Include("~/scripts/jquery-{version}.js"); 

// JS expression to run, to test if CDN delivered the file or not 
bundle.CdnFallbackExpression = "window.$"; 

bundles.Add(bundle); 

Um meine Google Pagespeed Insights Score ich das Skript asynchron geladen werden gewählt, um zu erhöhen:

@Scripts.RenderFormat(@"<script src=""{0}"" async></script>", "~/bundles/jquery") 

Aber jetzt, es scheint immer den CDN-Fallback-Ausdruck fehlschlagen und das Skript zweimal laden; einmal aus meinem Fallback-Bundle und einmal aus dem CDN, wenn der Async-Aufruf beendet ist. Ich gehe davon aus, dass der Async-Aufruf zum CDN nicht beendet wurde, wenn der Fallback-Test ausgeführt wird.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js" async=""></script> 
<script>(window.$)||document.write('<script src="/bundles/jquery"><\/script>');</script> 
<script src="/bundles/jquery"></script> 

Gibt es eine intelligentere Art, wie ich meinen Fallback-Ausdruck schreiben kann?

Gibt es überhaupt eine bessere Lösung?

Ich würde jQuery näher an der Unterseite laden, aber dann würde es alle Inline-Aufrufe brechen, die davon abhängen.

Antwort

0
<script id="srequire" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.jsWRONG" async="async"></script> 
<script type="text/javascript"> 
    function sOnerror() { 
     console.log("sOnerror"); 
     //if (typeof window.jQuery === 'undefined') { 
      var scr = document.createElement("script"); 
      scr.src = "/bundles/jquery"; 
      scr.async = true; 
      document.body.appendChild(scr); 
     //} 
    } 
    var element = document.getElementById("srequire"); 
    console.log("element", element); 
    if (element.addEventListener) { 
     //element.addEventListener("load", onsuccess, false); 
     element.addEventListener("error", sOnerror, false); 
    } else if (element.attachEvent) { 
     //element.attachEvent("onload", onsuccess); 
     element.attachEvent("onerror", sOnerror); 
    } else { 
     //element.onload = onsuccess; 
     element.onerror = sOnerror; 
    } 
</script> 

für u es zu testen ich im js Namen falsch gesetzt zu überprüfen, ob das Skript arbeitet ich es auf ff Chrom dh opra und Kante geprüft Sie requirejs verwenden können, sondern dass auch manchmal von CDN fehlschlagen, die ist warum ich dieses Skript verwenden glücklich zu teilen hoffe, es

„hilft, wenn die Last in einem Fehler (zum Beispiel ein DNS-Fehler oder einen HTTP-Fehler 404) den Skriptblock Ausführen nur des Brennens ein einfaches Ereignis bestehen müssen benannter Fehler am Element. "

source w3.org