cdn and fallback

https://www.davepaquette.com/archive/2015/05/06/link-and-script-tag-helpers-in-mvc6.aspx

It is a common approach to reference popular frameworks from hosted CDN in order to reduce network load on your server and potentially improve performance for the end user. For popular frameworks like jQuery and Bootstrap, there is a good chance that the browser will already have a cached version of these files.

Referencing files from a CDN can be a bit of a pain because you also need to provide a fallback to a version of the file hosted on your servers. A fallback is necessary because you do not want your application to go down just because the CDN is not currently reachable.

The script and link tag helpers make it easier to specify a fallback test and file location. Here is a basic example for the popular Bootstrap framework:

<link rel="stylesheet" href="//ajax.aspnetcdn.com/ajax/bootstrap/3.0.0/css/bootstrap.min.css"
      asp-fallback-href="~/lib/bootstrap/css/bootstrap.min.css"
      asp-fallback-test-class="hidden" 
      asp-fallback-test-property="visibility" 
      asp-fallback-test-value="hidden" />

<script src="//ajax.aspnetcdn.com/ajax/bootstrap/3.0.0/bootstrap.min.js"
        asp-fallback-src="~/lib/bootstrap/js/bootstrap.min.js"
        asp-fallback-test="window.jQuery">
</script>

 

asp-fallback-test for loading leaflet.js

评论1

It is any JavaScript expression that returns true if the the library is loaded. Be sure it doesn’t  throw an error if not loaded. The typical test is window.<some global from the library>

https://docs.microsoft.com/en-us/aspnet/core/mvc/views/tag-helpers/built-in/script-tag-helper?view=aspnetcore-5.0

 

评论2

Thanks a lot for answering . I've seen the reference before but nothing about what you said : The typical test is window.<some global from the library>

I solved my case by using   asp-fallback-test="window.L"  , and I saw the leaflet codes, many places used L.Somthing !! So I used L as global and it worked. but if you would mind getting more explanation about global, I searched Leaflet.js but all the variable are inside function(t,i), I looked at Leaflet Docs it is using L every where...

 

the other point, always we have 404 error on not loading first resource... I hope you meant "not throwing error" is any error except 404

 

asp-fallback-test

The script method defined in the primary script to use for the fallback test. For more information, see FallbackTestExpression.

 

https://github.com/lodash/lodash/issues/5260

The script method defined in the primary script to use for the fallback test. For more information, see FallbackTestExpression.

I am trying to use asp-fallback-test attribute to check if the script from cdn is loaded with integrity check.
Currently we use window.jQuery for jQuery and use window.axios for https://cdn.bootcdn.net/ajax/libs/axios/0.19.2/axios.min.js as the asp-fallback-test.

Related references
https://stackoverflow.com/questions/40626754/how-to-use-fallback-source-on-scripttaghelper-and-linktaghelper-correctly
aspnet/Mvc#1576
aspnet/Mvc#1580

 

作者:Chuck Lu    GitHub