Cache busting with grunt and JSTL c:url - node.js

I have a Java/Spring webapp and I'm trying to use grunt-cache-bust to cache bust my resource files (js, css) but this package doesn't seem like it is able to detect my resources and cache bust them. Does anyone know of another package that can do this while still allowing me to retain the use of JSTL's c:url?
I had referential problems loading resources in my site so I'm not open to removing c:url unless there's truly a better option.

grunt-cache-bust version 1.3.0 supports c:url value="someresource.js" inside a JS/CSS import. In the project I was working on discovered the reason why it wasn't working (which led to posting the question), the href or src attributes used single quotes instead of double quotes and these were not picked up by the cache bust module.
I changed this:
<link rel="stylesheet" type="text/css" href='<c:url value='/CSS/dialogs/dialog.css'/>'/>
to this and it worked:
<link rel="stylesheet" type="text/css" href="<c:url value="/CSS/dialogs/dialog.css"/>"/>

Related

Include mathjax equations in CHM file

I'm looking to create a chm file with a topic with some mathjax equations. The html file corresponding to the topic is very simple:
<html>
<head>
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
</head>
<body>
<p>
When \(a \ne 0\), there are two solutions to \(ax^2 + bx + c = 0\) and they are
$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
</p>
</body>
</html>
When I compile in HTML Help Workshop, it's all good. But when I open the resulting chm file and navigate to that topic, I get this issue:
and then the equations don't render - I just get whatever is written in plain text mode. Is there any way at all to get mathjax equations render properly in a chm file?
The CHM help file format is very old and hasn't been updated by Microsoft in a long time: internally it still uses a very old version of Internet Explorer to display the content of the topics.
Recent versions of MathJax are not compatible with older web browsers and that is probably why you are seeing this error.
To avoid this problem, you can either:
Use an older version of MathJax which is compatible with older web browsers such as Internet Explorer 6
Create a hyperlinks in your CHM help file to a webpage which shows the problematic content: it will be opened by the system's default web browser which is (almost) guaranteed to be much newer
Some help authoring tools also include a way to change the Internet Explorer compatibility settings which could be used to force Microsoft Edge to be used to display content: it should allow MathJax to run properly
MathJax used to be able to work in CHM files, but it was a bit fiddly to get it to work. As I recall, you had to use an explicit configuration rather than the ?config=... approach for one thing. There are some very old discussion about it in the MathJax user's forum; see here. it was always a bit difficult to get it to work, and these discussions were about very early versions of MathJax (v1.1, v2.0, v2.1), so you might need to explicitly select older versions of MathJax. Also note that the cdn.mathjax.org address was retired in 2017 (it still exists, but redirects to another CDN, and that might also be a problem for CHM files), so you may want to use one of the other CDNs that serve MathJax, e.g., cdn.jsdelivr.net/npm/mathjax#2/MathJax.js, instead.
As a first simple step you'd try to add following line into your HTML topic files:
<meta http-equiv="X-UA-Compatible" content="IE=11">
Tested and compiled by using FAR HTML with HTML file shown below and some css stuff. I did a reverse test by deleting the line mentioned above only and the script error window appears again.
For further information using X-UA-Compatible see also: https://stackoverflow.com/a/6771584/1981088
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=11">
<title>MathJax Test</title>
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
<link rel="stylesheet" href="../design.css">
</head>
<body>
<h1>MathJax Test</h1>
<p>
When \(a \ne 0\), there are two solutions to \(ax^2 + bx + c = 0\) and they are
$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
</p>
</body>
</html>
is resulting in a CHM topic like this:
Of course you need a internet connection.

Don't find node_module file in twig

I'm on symfony 5.3.
I want to import a node_modules file in twig.
So I did that:
<link rel="stylesheet"href="/node_modules#fancyapps/ui/src/Fancybox/Fancybox.scss">
But it isn't find when i load the page. I've tried by add "../" before, but I don't find the solution.
is there a function which allows, in the same way as {{asset ('')}} to go to the public folder, to go to the node_modules folder?
I haven't found anything about it personally.
The error in the console navigator:
GET https://localhost:8000/node_modules#fancyapps/ui/src/Fancybox/Fancybox.scss net::ERR_ABORTED 404
thank you very much.
Yet I searched for hours before asking you, but luckily I found a suitable solution just after.
In fact, it suffices to keep the same line except that instead of <link rel="stylesheet" href="node_modules_files"> it is necessary to put <link rel="import" href="node_module_file">
Thanks anyway! :)

How to use Appcache with web frameworks?

I have a problem about changing the main page, I use Tornado, and in Tornado, there is a special value which is generated everytime the server is reached, it is a token to avoid xsrf attack, but when I use .appcache file, the problem is that it caches everything! and I only show to cache static like css, js, fonts, here is what it contains:
CACHE MANIFEST
# v = 2
/static/css/meteo.css
/static/css/semantic.min.css
/static/js/jquery-2.1.1.min.js
/static/css/main.css
/static/js/semantic.min.js
/static/js/geo.js
/static/js/meteo.js
/static/fonts/icons.woff2
/static/fonts/icons.woff
/static/fonts/WeatherIcons-Regular.woff
NETWORK:
/
FALLBACK:
It doesent work, the / get cached!
So how to do this with new Framework, where it we dont make the html file in the route, but the uri that is bound to a function/class?
Here is a video I made about it
And it seems that the master is always cached :
Update: From this page, it is noway!
But, you say, why don’t we not cache the HTML file, but cache all the rest.
Well. AppCache has a concept of “master entries”. A master entry is an HTML file that includes a manifest attribute in the html element that points to a manifest file (which is the only way to create an HTML5 appcache BTW). Any such HTML file is automatically added to the cache. This makes sense a lot of the time, but not always. In particular, when an HTML document changes frequently, we won’t want it cached (as a stale version of the page will most likely be served to the user as we just saw).
Is there no way to over-​​ride this? Well, AppCache has the idea of a
NETWORK whitelist, which instructs the appcache to always use the
online version of a file. What if we add HTML files we don’t want
cached to this? Sorry, no dice. HTML files in a master entry stay
cached, even when included in the NETWORK whitelist. See what I mean.
Poor AppCache didn’t make these rules. He’s just following them
literally. He’s not a douchebag, he’s a pain in the %^&*, a total
“jobs-​​worth”.
I got the solution from here:
I made a hack.html which contains:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Hack 4 Manifest</title>
</head>
<body>
{% raw xsrf_form_html() %}
</body>
</html>
And then
Add this in the main page:
<iframe style='display: none;' src='/hack'></iframe>
And then in Tornado:
(r"/hack", handlers.Hack),
class Hack(MainHandler):
#tornado.gen.coroutine
def get(self):
self.render("hack.html")
And then I use the javascript call:
xsrf = $("iframe").contents().find("input").val()
$("#laat").html('<input id="lat" type="hidden" name="lat"></input><input type="hidden" name="_xsrf" value='+xsrf+'><input id="lon" type="hidden" name="lon"></input><input class="ui fluid massive yellow button" value="Get forecast" type="submit"/>');

How to intercept a Javascript/CSS file request from the Webpage at the cleint side, and load alternative files insted?

For example, a webpage loads its JavaScript files like this inside the head tag:
<script src="http://www.somedomain.com/js/somejsfile.js"></script>
or for CSS files:
<link rel="stylesheet" type="text/css"
href="http://www.somedomain.com/somecssfile.css">
What I want to achieve is that, while loading the page itself, instead of the original http://www.somedomain.com/js/somejsfile.js it should load another file http://www.anotherdomain.com/js/anotherfile.js
May be via some custom firefox/chrome (preferably not IE) extension or something else.
Hint:
This can be also used to subsitute jQuery library etc. to load from local source instead of remote Google* hosted file.
injecting your own content script at "document_start" will give you the chance to analise and modify the document, even before the DOM is constructed and any script is started.
But at that time, all CSS files are already loaded. Perhaps you may redefine them with other CSS.
See "run_at" property in "content-scripts" property, in manifest.json:
http://code.google.com/chrome/extensions/content_scripts.html

Preferred way to use favicons?

I was trying to add a favicon to a website earlier and looked for a better way to implement this than to dump a favicon.ico file in the root of the website.
I found this nice little guide: How to Add a Favicon. However, the preferred method did not work in IE (7) and the second method is the old fashioned way (which I resigned myself to use).
Is there a third method that works across all the most popular browsers?
This is what I always use:
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
The second one is for IE. The first one is for other browsers.
You can use HTML to specify the favicon, but that will only work on pages that have this HTML. A better way to do this is by adding the following to your httpd.conf (Apache):
AddType image/x-icon .ico
I think the most reliable method is the simply added the favicon.ico file to the root of your website.
I don't think there is any need for a meta tag unless you want to manually override the default favicon, but I was unable to find any research to support my argument.
This is how they're doing it right here on Stack Overflow:
<link rel="shortcut icon" href="/favicon.ico" />
Well, the file is in the root so it does not show whether the tag works or if the browser just got the icon from the usual location (the root).
Edit: I'll try it and see if it works.
Edit 2: Using both tags make it work even for any file name as long as the file is an icon for IE7: I tried using .png files and it only worked with Firefox.
There are a million different ways these icons are used (different browsers, different platforms, mobile site-pinning, smart TVs, etc, etc), so there's really no longer a simple answer. For a great explanation see this S.O. answer, but the short answer is:
Use this site which lets you upload a png/jpg and then does all the hard work for you: https://realfavicongenerator.net/

Resources