I have a problem with external css. When I have creating my project using html and css the css is working fine but when for some reasons I have change this
#LoadModule rewrite_module modules/mod_rewrite.so
in httpd.conf file in apache
to this
LoadModule rewrite_module modules/mod_rewrite.so
my all the css are not working properly and one more thing is that when I have checked the console
Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://localhost/E-commerce/styles/style.css".
anybody tell me that this is the main reason or not
A Simple description to whats happening during the process is that browser Send HTTP Request and receive a response to that request from the server to two contains headers.in this case your server is making stylesheet come with wrong content-type try first to inspect element using dev tools in browser and investigate the response from server .
i believe if you create new htaccess with the following content :
AddType text/css .css
this will tell server to send it as stylesheet
Many times when your css file is large so your browser stores it in cache and hence not every time it renders your css file when updated in editor and reloaded the site.
To rectify this simply press Ctrl+F5.
This will clear the browser cache for that tab(that website) and reload the page forcing the browser to render the updated css.
This should work without touching your .htaccess file.
EDIT: For Mac if you are using safari, the sortcut is Command+Alt+E
In Mac if you are using Chrome, Ctrl+F5 will not work, so refer to this site: https://clear-my-cache.com/en/apple-mac-os/google-chrome.html
Use ctrl + F5 to clear browser caches on window.
This should work.
Related
I am using bootstrap.min.css and my entire website uses this single CSS file for all pages. There are 179 pages on my website and my bootstrap.min.css is just 117Kb
is there any way to store this file on the client's system when he opens home page
and when user moves to the next page how can I use CSS file stored on the client's system ?
this how am linking file this right method
<link href="../../../css/proper align.css" rel="stylesheet">
If the css file is accessed via the exactly same URL (same server, same path, same filename, no attached parameters) and the caching headers are set properly (which they are by default), the file will be cached by the browser.
You can check this behavior using the development tools of your browser.
Here you have a screenshot from the devtools of Google Chrome (hit F12). On the network tab I have selected bootstrap.min.css and I see that it is served from the browsers cache. All fine here. If you don't get it from cache, you can check the caching settings inside the response header.
(http://imgur.com/wSliBMk)
By default the .css file will get cached on client side.
This means it will only be downloaded once for all the 179 pages you have on you website.
All of this caching and reading from cache is handled by the client browser.
If you are not planning on doing any weird "magic" with the css file you won't have to worry about it.
If you reference the same path in the html file the browser will "know" that it has to use the already cached file.
This cache will most of the time persist after the client closes the browser and returns to your website a later time.
Well, the file IS stored on the clients system, it's called caching and is done automatically by browsers. If you reference the same file on all pages, then it's loaded from the same location.
If you worry about bandwidth, I recommend using a CDN-service for your Bootstrap file.
(eg. "//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css")
I have an anchor tag that is used to request the download of a file.
Like this:
Download
The file may be modified on the server very often, so I want to make sure the browser does not cache the file.
However, testers found out that, although it seems to always download the file when you click on the link, when you right-click on the link and choose "Save As...", the browser seems to choose to use the cached file instead. This was tested with IE9.
How can I force the browser (especially IE9) to always download the file in every case?
I'll add as an answer. Try adding a random number to the query part of the href:
?param=[random]
As per my own comment for one of the answers:
According to wikipedia I can set the response header parameter: Cache-Control: no-cache
http://en.wikipedia.org/wiki/List_of_HTTP_header_fields#Effects_of_selected_HTTP_header_fields
After receiving a response with this header, the browser will not cache this data anymore.
Hi I have crawled a website for offline view, but many pages are downloaded and saved as .asp and there are links that point to these pages. But when I open these html page that has .asp extension in Chrome browser, the chrome will download the page instead of rendering the page. Is there a way to set the chrome to render the page instead of downloading it ?
Thanks
Chromium uses the system mime-type for the local files. On Linux you can change it in the xdg-open configuration:
$ mkdir -p ~/.local/share/mime/packages
$ cd ~/.local/share/mime/packages
$ touch application-x-asp.xml
Then edit the ~/.local/share/mime/packages/application-x-asp.xml:
<?xml version="1.0" encoding="UTF-8"?>
<mime-info xmlns="http://www.freedesktop.org/standards/shared-mime-info">
<mime-type type="text/html">
<comment>Active Server Page</comment>
<icon name="text-html"/>
<glob-deleteall/>
<glob pattern="*.asp"/>
</mime-type>
</mime-info>
to set up the mime-type to text/html. On te end you have to logout/-in again, or just run:
$ update-desktop-database ~/.local/share/applications
$ update-mime-database ~/.local/share/mime
When your browser opens a file it uses the MIME type to decide which action it should take, typically download or open in the bowser.
So, for example, it encounters a zip file it will open the file save dialogue box and allow you to save the file.
And, if for example, you request a .asp from your browser which is served from a web server the browser will use the MIME type to decide which action to take, which will be to display in the browser.
The MIME type will be sent within the http headers and this would not be sent to the browser when you open your off-line .asp pages.
So if you could change the MIME type to "text/html" for .asp it should open it in the browser.
Unfortunately, there does not seem to be an option for changing MIME type / actions in Chrome.
You can change these setting in Firefox within Tools > Options > Content > FileTypes > Manage..
There is a way to open local, .asp files as HTML in Firefox.
Find your Firefox profile folder. On Windows 7, I found it here:
C:\Users\user\AppData\Roaming\Mozilla\Firefox\Profiles\738xdie.default\mimeTypes.rdf
Then add these lines to mimeTypes.rdf
<RDF:Description RDF:about="urn:mimetype:text/html"
NC:fileExtensions="asp"
NC:description="ASP Pages"
NC:value="text/html"
NC:editable="true">
</RDF:Description>
Restart browser. Your local file will now render as HTML.
There may be a similar technique with Chrome.
I suppose you want to view downloaded pages directly, that is not via some local web-server. Then I'd suggest to change (or append) file extensions during download according to their reported content-types from response headers. Of course, this will require to adjust all links to changed filenames inside other files. The other approach could be to store content-type of each page in a meta-base, and using a local web-server to serve the files according to their actual types from the base, not file extensions.
I have two solutions for you. the first one is to open those files with firefox.. and that's it..
if you insist to open them with chrome. you have to change all files extension to html instead of asp. use some programs for renaming..
but the links will be broken between pages..
so you have to find the js file that all pages use add this code in it to fix the links
document.body.addEventListener('click',function(e){
if(e.target.nodeName=='A'){
e.preventDefault()
href=e.target.href.split('/')
href[href.length-1]=href[href.length-1].replace('.asp','.html')
href=href.join('/')
parent.location=href
}
})
})
I'm trying to get a simple html5 webcache to work.
This is my one and only html page, index.html:
<!DOCTYPE HTML>
<html manifest="./main.manifest">
<body>
<p>Hi.</p>
</body>
</html>
This is my only cache file, main.manifest:
CACHE MANIFEST
# 2011-05-02-03
index.html
I'm running on apache shared hosting, I put a .htaccess file in my web directory where these other two files are, because I thought maybe I have to define the mime type:
AddType text/cache-manifest .manifest
So in the end I just have these three files in that directory:
index.html
main.manifest
.htaccess
When I visit the page on chrome from my mac, safari from my iphone, or chrome from my android 2.3 device, nothing happens, the page just loads as usual. If I turn airplane mode on (killing all connections) the page can't be loaded (so I guess caching failed).
What am I missing here?
Thanks
------------ Update ------------------
I think the mime type was not being recognized correctly. I updated .htaccess to:
AddType text/cache-manifest manifest
Now if I run in google chrome with console on, I see:
Document was loaded from Application Cache with manifest
http://example.com/foo/main.manifest
Application Cache Checking event
Application Cache NoUpdate event
Firefox prompts me when I load the page about the website wanting to let me store it to disk, so that's good. Looks like it's also working on android 2.3.4. The browser still says "This page cannot be loaded because you are not connected to the internet", but then it loads anyway.
Thanks!
First, you were right the first time on your mime type declaration. It should be like this:
AddType text/cache-manifest .manifest
Next, read this paragraph from Dive Into HTML5:
Q: Do I need to list my HTML pages in my cache manifest?
A: Yes and no. If your entire web application is contained in a single
page, just make sure that page points to the cache manifest using the
manifest attribute. When you navigate to an HTML page with a manifest
attribute, the page itself is assumed to be part of the web
application, so you don’t need to list it in the manifest file itself.
However, if your web application spans multiple pages, you should list
all of the HTML pages in the manifest file, otherwise the browser
would not know that there are other HTML pages that need to be
downloaded and cached.
So, in this case, you don't need a cache manifest. The browser will automatically cache your page (as long as it's the only resource, such as a CSS file or Javascript file, for example).
For more information, visit the link above.
I have had some trouble using "explicitly cached" items in my manifests, so I usually set it up like this:
CACHE MANIFEST
# 2011-05-02-03
CACHE:
index.html
But the other answer is correct, the browser will automatically cache any URLs that include an application cache manifest.
I recommend using Chrome's JavaScript Console -- it outputs application cache events as they are happening, including errors.
How do you make an MP3 link download instead of play "in-browser"?
I tried changing the target to blank, but that just opened the player in a new window.
You can't do this by modifying the link. You will have to have the HTTP server that serves the file send a Content-Type of "application/octet-stream". Presumably it is sending the type "audio/mpeg", which is hinting to the browser that it is MP3 content. Without the capacity to alter this header, you can't achieve this.
If your server supports PHP, create a PHP script called "getfile.php" (or similar) that takes a parameter of a file ID or file name. Set the content-type and content-disposition headers within the script to force a download prompt.
See: http://webdesign.about.com/od/php/ht/force_download.htm
Lots of solutions here. Here's the basic idea:
Use Javascript to make a (ajax) request to the server
When the request is received, run a script
This script redirects your browser temporarily to a new page
The new page has a few headers telling your browser to expect a file attachment, and what kind of attachment it is
The "save as" dialog pops up and your original page is still onscreen
I could be wrong, but I've seen people with the same problem before just with other file types, they used the code below:
<FilesMatch "\.(?i:mp3)$">
ForceType application/octet-stream
Header set Content-Disposition attachment
</FilesMatch>
Hope this works for you!
For quite some time (Chrome 14+, Firefox 20+, Edge 44+) it is possible to use the download attribute on same-origin links to force download behavior even when the server doesn't supply a Content-Disposition header on the link target.
Without access to the server generating the HTTP responses, the browser gets to decide what to do with different types of responses. usually the only files a browser will download are things like .zip files which it cannot display.