I'm still relatively new to making webs, I read about adding version numbers to CSS files so the browser loads the newest version, I changed my style.css name to style.css?v=1 on my HTML, do I need to change the file name of the CSS too? Forgive me if my lingo is weird
As #Dan Canetti suggested - this is the comment that I had above - included as an answer so the OP can resolve the question.
No - you do not need to change the file name of the .css file. The query string that is appended to the file name in the browser is used to allow the sourcing of the file without changing it.
If you have a styles.css and you call it with styles.css?v=1 - then it will still load. The difference is that the browser can cache the content and if it already has loaded styles.css?v=1 then it will load it from the cache - not the server.
Then if you make some change and you then call styles.css?v=2... the v2 version will not be in the loal cache and so the browser will retieve it from the server
Related
How do I find the filename of an website I am inspecting with Firebug? As example when I look on http://example.org/ I can view inspect the Element, I see the whole html structure but I didn`t find the filename. I am searching for index.html or something in that way. Maybe this is an analog question, but I am not sure, because he/she is working with php. LINK
I know there are some solutions with Dreamweaver or other tools but I am searching for an easy way to figure that out with Firebug or an free Browser Add-On. I Hope you have a solution for that.
The URL you entered is the one that usually returns the main HTML contents. Though on most pages nowadays the HTML is altered using JavaScript. Also, pages are very often dynamically generated on the server.
So, in most cases there is no static .html file.
For what it's worth, you can see all network requests and their responses within Firebug's Net panel.
Note that the URL path doesn't necessarily reflect a file path on the server's file system. It is depending on the server configuration, where a specific URL maps to in the file system. The simplest example is the index file that is automatically called when a domain is accessed. In the case of http://example.org the server automatically loads a file index.html in the file system, for example.
So, in order to get the file name on the file system, you need to either check the server configuration or the related access logs.
We created a simple Flash animation that reads from an XML file in another server. This XML file has tags with the path of several images that will be displayed in the Flash. The xml tag looks like this:
<image_name><![CDATA[assets/images/image1.jpg]]></image_name>
When I tested locally I realized that, even after I changed the image in the XML, the SWF was still showing the image from the browser cache. So the developer ended up adding some random function so that the cache would not be an issue. That fixed the issue.
Unfortunately, the webhost that will publish the SWF tells me that they can't upload the SWF because the system doesn't allow SWF files that use random functions. So I can remove it and resubmit, but then the problem with the cache will be there.
Is there another alternative?
Thanks.
Preventing caching at all isn't a good idea in general, it's very useful feature that safes server traffic and decrease swf loading time.
Some of the solutions here can be to change URL in the xml config by adding version of the image manually:
<image_name><![CDATA[assets/images/image1.jpg?image_v1]]></image_name>
or generate this version automatically with script as md5 of the image bytes:
<image_name><![CDATA[assets/images/image1.jpg?5d41402abc4b2a76b9719d911017c592]]></image_name>
but it's required much more setup work.
Or add the version of the swf application:
<image_name><![CDATA[assets/images/image1.jpg?app_v1]]></image_name>
the last solution is a compromise between two options - maintaining version of each image file and removing cache at all. In this case you have to maintain only the version of swf file, but you have to update it each time you change some of the images.
Preventing cache isn't good, but here is my solution: use a "random" number (current time in seconds) as a param assets/images/image1.jpg?t=RandomNumber.
I know how to tell the browser to download cached fuiles again by simply changing a character in the appcache manifest, but when I do that, how can I make sure the browser downloads the new file without doing things like changing filenames?
I am aware of file expiration headers I can send, but I have no experience with them. Would they even work with HTML5 caching? Which ones do I send?
I'm under the impression that browsers aren't smart enough to detect when a file is modified, and will continue using the cached file until you force it by refreshing the page or changing the filename. I don't want to do that since it also means updating the manifest and is just extra work.
My optimal solution is to change the manifest slightly, then the browser goes and fetches any changed files without me forcing it to.
What I do is add the timestamp as a comment in the manifest
# 20130623 025200
And just update it each time I want to force a refresh.
EDIT: As I noted in the comments, The browser will re-download all files explicitly enumerated in the manifest. For files that are not in the manifest (for example, CSS or images referenced in an HTML file but not in the manifest), the default expiry take precedence.
The algorithm is described in the standard: http://www.w3.org/html/wg/drafts/html/master/browsers.html#downloading-or-updating-an-application-cache
PROBLEM:
Today, we modified a static html web page in a client's website -
we added a couple of images and modified the font. And FTPed the file to client's web server.
We realized we made a mistake with the font-size, corrected it, and FTPed the file again.
Even with a 100 refreshes, the website was displaying only the file (with wrong font) that we had FTPed the first time.
We FTPed the corrected file several times, but the file with the wrong font was the only file being served by the web server.
OUR GUESS:
We think that the web server cached the file that we had FTPed the first time, and is serving it back to us on subsequent requests even though the file had changed.
We tried the following techniques (but were unsuccessful):
We added a parameter to the querystring (?R=33343545)
We tried the technique suggested below - i.e. posting to the webpage in question, but got a "405 Method not allowed. The HTTP verb used to access this page is not allowed."
http://www.mnot.net/blog/2006/02/18/invalidation
Please advise if we were on the right path and if there is anything else that we can try in such situations ?
EDIT:
We would like to find out if there is a way (similar to the 2 methods above) to do it just from the browser..and not touch the settings on the webserver.
Gurus of SO
I am trying to play with CACHE MANIFEST/HTML5. My app is JS heavy and built on jquery/jquerymobile.
This is an excerpt of what my Manifest looks like
CACHE MANIFEST
FALLBACK:
/
NETWORK:
*
CACHE:
/css/style.css
/js/jquery.js
But somehow, the app doesn't load the files the first time itself and the entire app breaks down.
Is my format wrong?
Should I never load JS into the Cache?
How should I treat this differently to always check the network first if anything isn't available and only load stuff available from the Cache?
Thank you.
I tried a simple page with your cache manifest and it worked fine for me, so I'm not really sure what the problem is. But,
Yes, there is something wrong with the format. The entries in the FALLBACK section need to have two parts: a pattern, and a URL. This says "if any page matching the pattern is not available offline, display the URL instead (which will be cached)." The main example of this (as shown here) is "/ /offline.html", which means "for all pages, if we are offline and they are not cached, display /offline.html instead." However, I don't think this is the source of your problem since I tested it with your exact manifest and it still worked.
There is nothing special about JS files. It should be fine to load them into the cache.
I don't understand the third question. There are possibly two goals here: a) how do you check to see if there is a newer version of the file available online first, before going back to the cache, and b) how do you check the network to see if there is a file that is not cached, and if we are offline, fall back to an error page. The answer to (a) is that once you have turned on the cache manifest, things work very differently. It will never check for new versions of the files unless there is a new version of the manifest also. So you must always update the manifest whenever you change any files. The answer to (b) is the FALLBACK section.
See Dive Into HTML5's excellent chapter on this, particularly the section "The fine art of debugging, a.k.a. “Kill me! Kill me now!”" which explains how the manifest updates.
Also I don't think we've gotten to the meat of your question, because it's unclear what you mean by "the app doesn't load the files the first time itself". Which files don't load? Do they load properly after a refresh? Etc.
The only way I got this to work to refresh a cache was to rename the manifest file with a commit number or timestamp, and change the cache declaration to
<html manifest='mymanifest382330.manifest'>
I made this part of my build.