Nginx Server Caching in Chrome - google-chrome

I'm setting up a local development server on my Mac using nginx in place of Apache. I'm basically there, but having one issue.
I have multiple web apps, and each are set up using sites-available and sites-enabled - no issues here. The issue is that my browser of choice is chrome, and there's some weird caching going on that is causing the first-visited app to load each time. For example, I have:
site1.dev
site2.dev
If I load site1.dev, it loads without issue. If I load site2.dev, it's automatically redirected to site1.dev. I see this as a caching issue because if I use chrome's Incognito mode, I don't have the same issues (nor do I have them in Firefox).
Does anyone know what could be going on here? Or what the solution could be? Thanks in advance!

The solution is to open Chrome's Dev tools (right click, inspect element), click the network tab, and disable caching. Reload the first url, and try the second url. If there is no redirect, disable caching, and the issue is resolved.
Chrome only redirects from cache if the page was initially loaded with caching enabled.

Related

view-source in href shows error in console

Click Me
This used to work as a valid href attribute but it seems in the past few months it now shows an error in the console (I'm using Chrome):
Not allowed to load local resource: view-source: http://stackoverflow.com
I found some links from 2013 where this was once a bug in Chrome but said it was fixed.
Could someone point me to an authoritative source that can explain why this no longer works? I assume that this is security by the browser and not an angular issue (since view-source is whitelisted and used to work)
Looks like Chrome and Firefox (at least) disabled this within the past year or so
I found this thread, and these release notes explaining why and provides a timeline as to when the change took place.
Related StackOverflow question: File URL "Not allowed to load local resource" in the Internet Browser
Chrome responds with the "Not allowed to load local resource:" as a security protocol. I'm not sure why this used to work, but not now, though there is no real way around this unless web-security is disabled. There may be a different outcome on other browsers, but ultimately you are correct in thinking that it's Chrome's security.
The reason is that Chrome tries to preload URLs in background, to speed up your browsing experience.
If you open the DevTools after loading the page, the content of the items listed on the Resources tab may not be populated. This is also true of network requests on the Network tab. To see the fully populated resources on the Resources tab, first open the DevTools, then refresh the page, or navigate to the desired page with the DevTools open. Now select the html resource and it should be populated.

Webpage doesn't update after changing files via FTP

I have a website with a domain and host. I sometimes change some pages and upload them via FTP (I'm using FileZilla). Tough, when I enter the webpage from the domain, the latest changes doesn't appear. I have checked many times the html files I've changed and they all look correctly uploaded to the host. But when I save the html page and check its code, the changes doesn't appear as expected. Why are the changes aren't being updated when browsing the webpage and how can I solve this?
Try refreshing the page using CTRL+F5, if it's not working, clean browser cache.
Clean your browser Cache or try opening a private navigation window.
Your Browser will Cache files so it doesn't have to load them every time. Usually refreshing will solve the issue but a surefire way is to enable the "disable browser cache" option in Chrome's dev console (firefox may have something similar).
When you open the dev console there is a gear in the upper right that opens the options menu. In the "General" tab the "Disable cache (while DevTools is open)" option is available. after enabling this just refresh the page with the console open and it will download all of the latest files from your server.
Did you try running ng build before uploading the website to FTP? If your website is made on Angular then ng build is must to update the new changes. I got the same problem and ng build worked for me :)

Webpage displayed in Incognito, not in regular Chrome

So i have been running into this problem with a lot of Wordpress sites lately, usually occurring when i am logged in as Admin, so i couldn't post here because no one would be able to view the problem. However, i just found a site that it happens on that doesn't require admin creds.
http://www.otisports.com/
When i visit this site in Chrome (Version 34.0.1847.137 m), it just displays a blank page. No errors, just the (what now seems standard) event.returnValue is deprecated. Please use the standard event.preventDefault() instead. warning. I have seen that warning signify problems on the site, but they are usually minor, not to the extent that the above URL displays. However, if i open an Incognito window and visit the site everything works perfectly and there is no warning. Does the Incognito window deal with webpages in a way that is so entirely different that it would cause something like this to happen?
I have been racking my brain trying to figure this out. Can anyone reproduce this? is it a bug in chrome?
EDIT: I just tried to open a bounty on this question and the EXACT same thing happened. In Regular Chrome, nothing happened when i clicked the start a bounty link and i saw various errors Undefined is not a function however in incognito everything worked perfectly. what gives?!
EDIT: Yes, i have cleared the cache, history, cookies, everything, and i still get the same errors. I cant even post a comment on this question because of errors...
I came across the same issue when trying to open evernote.com. It loaded successfully while using incognito mode in chrome. Let me share how I fixed this even though the original post is way too old. But maybe someone can find it useful.
I'm using chrome (Version 73.0.3683.103 (Official Build) (64-bit)) running on Linux Ubuntu 18.04.2 LTS.
I tried disabling all extensions and clearing browser data/cache but nothing worked. PS: Disabling adblock previously worked for me. Yes, I stumbled over the same issue before and whitelisting evernote in adblock solved the issue. But it didn't now.
The following is what worked for me:
Open developers tools (CTRL + SHIFT + J).
Navigate to Applications tab.
Choose Clear storage from the side menu
Hit Clear site data button.
After reading the comments I dug into chrome and saw there was a bunch of extensions still sitting around that were definitely malware and I thought I had previously deleted. Instead of picking through them one-by-one, I just deleted everything, re-installed Chrome, and now everything works great!
I had the same issue. My application was working in Incognito mode and in Firefox but not in Regular Chrome. I even disabled all the extensions but no luck. I eventually cleared the Cached images and files because on developer console I found out that the regular chrome was still picking up the old file due to caching. So as soon as I cleared it, my app showed up like a rocket :)
Try removing any non required extension .
Specifically AdBlock
I resolved the problem post that.
Since on Incognito , extensions are disabled, hence page run as expected.
I resolved this unforeseen issue using following steps.
CTRL + SHIFT + DEL > Clear Browsing Data.
Cookies and other site data
Cached images and files
This is for Chrome Browser.
Open Console (Ctl+Shift+I) first.
Then under the application tab, you will find some options on the left, find out the application there, you will find it at the top.
There you will find Service Workers.
Under Service Workers, there will be three checkboxes. Select Update on reload checkbox and reload again.
I had the same issue after installing React-Sight Extention.
The Page hanged but not in the incognito mode.
Try deleting any recently added or junk extension.
Delete your cache.
That worked for me
I had a similar issue in chrome, in my case the problem was that I could log in to my university library's website only in incognito mode. After some digging, I figured out that Google Translate extension was set to automatically translate any page. When I turned that off and instead selected never translate that specific page, it started working in the usual mode as well.
This is rather an old issue but still happens. None of the solutions recommended here and there did not solve the issue in my case.
I somehow noticed this is related with a -some kind of- corruption on the user profile.
This is how I solved it:
Close all Chrome browsers.
Open a Google page on Chrome.
Sign-out from Google (rigt click your profile picture on a Google page, not on the Chrome itself), and sign-in.
If this doesn't work:
Close all Chrome browsers.
Right click Chrome icon and select Google Chrome.
Delete your Google profile on the "select your profile" page.
Close Chrome.
Open Chrome, sign-in.
uBlock Origin was the culprit in my case. Once I allowed the site in uBlock Origin, pages loaded correctly in normal Chrome.

Automatically update websocket frame in chrome web inspector

When I inspect a web socket in Google Chrome Web Inspector, (see Chrome Web Inspector Web Socket Debugging), I have to keep clicking the socket on the left to refresh the messages on the right.
Is there any way to have this automatically refreshed each time a new message is sent/received? Or has this simply not been developed yet?
Unfortunately this is still the case even in dev channel (v27 atm) and looking at Chromium bugtracker it doesn't seem to be planned either.
Relevant issue here
You can vote on it, though I cannot say if that actually accomplishes anything.
I have tested with latest Chrome (32.0.1700), they still don't support automatically update of WebSocket frames. However you can use Fiddler (with FiddlerScript) to inspect WebSocket traffic in the same way you inspect HTTP traffic, and it supports auto refresh of frames.
Please refer to the article on CodeProject, which show you how to Debug/Inspect WebSocket traffic with Fiddler (with FiddlerScript). http://www.codeproject.com/Articles/718660/Debug-Inspect-WebSocket-traffic-with-Fiddler

How to force Chrome's script debugger to reload javascript?

I really like the ability to edit javascript in the chrome debugger however, I find that it can be really problematic getting the debugger to re-fetch the JavaScript from the server.
Sometimes I have to go as far just closing the debugger and reloading the frame works OK - but other times (an dI cannot pin down under what conditions this occurs) I have to clear my temporary internet cache. Sometimes I swear I have to close chrome completely, then clear the cache and then load the page before the debugger finally shows me the most up-to-date script.
(NB. There is no caching of the script by the web server)
I was wondering if anyone knew of a quick and easy way to tell the debugger to invalidate all its javascript and fetch it all anew on page reload?
While you are developing your script, try disabling the Chrome cache.
When you reload the page, the JavaScript should now get refreshed.
Chrome circa 2011
Chrome circa 2018
You can also access it on the network tab:
The context menu shown above is accessible by right clicking / presssing & holding the "reload" button, while Chrome Dev Tools is opened.
Empty cache and hard reload works best for me.
Another Advantage: This option keeps all other opened tabs and website data untouched. It only reloads and clears the current page.
You can always clear a specific file by doing the following:
Open Dev Tools
Click on the Sources tab
Find your script / image / file
Check the right panel to see if your file is up to date
If not:
Right click the resource in the left panel and choose 'Open Link in New Tab'
Force a reload of the resource with the methods above. (See #Bishoy Hanna's example)
This is very handy if you have resources that are in frames and CTRL+F5 is not force refreshing them.
Shift+F5 quickly clears the cache.
Here's a shortcut to DevTools:
F12 to open Chrome DevTools
F1 to open DevTools Settings
Check Disable cache (while DevTools is open) as shown below:
Note: Updated per Dimi's comment. They tend to move it so let me know or update the post if you notice that it's changed.
For Google chrome it is not Ctrl+F5. It's Shift+F5 to clear the current cache! It works for me !
On Windows, Ctrl+Shift+r would force reload the script in chrome.
If you are making local changes to a javascript in the Developer Tools, you need to make sure that you turn OFF those changes before reloading the page.
In the Sources tab, with your script open, right-click in your script and click the "Local Modifications" option from the context menu. That brings up the list of scripts you've saved modifications to. If you see it in that window, Developer Tools will always keep your local copy rather than refreshing it from the server. Click the "revert" button, then refresh again, and you should get the fresh copy.
It seems as the Chrome debugger loads source files into memory and wont let them go despite of browser cache updates, i.e. it has its own cache apart from the browser cache that is not in sync. At least, this is the case when working with source mapped files (I am debugging typescript sources). After successfully refreshing browser cache and validating that by browsing directly to the source file, you download the updated file, but as soon as you reopen the file in the debugger it will keep returning the old file no matter the version from the ordinary browser cache. Very anoying indeed.
I would consider this a bug in chrome. I use version Version 46.0.2490.71 m.
The only thing that helps, is restarting chrome (close down all chrome browsers).
Right click on reload button in chrome and click "Empty Cache and Hard Reload"
If the files which you are loading are cached and if the changes you have made does not reflect in the code then there are 2 ways you can deal with this
Clear the Cache as everyone told
If u want Cache and only the files have to be reloaded , you can go to network tab of the dev tool and clear whatever was loaded. next time it will not load it from cache. you will have your latest changes.
There are also 2 (quick) workarounds:
Use incognito mode wile debugging, close the window and reopen it.
Delete your browsing history
Deactivating Breakpoints caused the new script to load for me.
In my opinion it's easiest to work in a 'private browsing session' of chrome, to ensure that your javascript files don't come from the cache.
If there is document on URL:
file:///C:/Users/user/Desktop/site/index.html
Add any parameter to your URL, like this:
file:///C:/Users/user/Desktop/site/index.html?foo=777
and the browser'll refresh all sites resources
You can also use this Chrome extension to quickly switch between using or not the cache: https://chrome.google.com/webstore/detail/cache-killer/jpfbieopdmepaolggioebjmedmclkbap