Strange problem with main.js file and index.php .

[Ali_Hegazy]

Hello developers,

   When I was working on password generator website using PHP, I connect the main.js file to the index file and everything is okay and it works, but when I close the device and reopen it and open the project any change in the javascript file does not affect on the index file and when I open the inspect and see the sources the main.js file is constant at the code before I turn off the device, then I change the name of js file and reconnect it to the index.php and it works, and the question here WHY this happened?

I wish anyone help me because in real life I will not change the name of the files everyday.

NOTE: my OS is Ubuntu.

Thank you.

Edited 19 hours ago by Ali_Hegazy

[Ali_Hegazy]

Updates: the same problem happens again when I suspend the device and I try to close LAMPP and start it again, and it works but the same question WHY this happened ? 

[mac_gyver]

browses cache content by default. on your development system, you must tell the browser to not cache the content of file types that you will be changing often during the development process.

your web server likely/should already have a setting that outputs headers for .php files that tell the browser to not cache the content for the request. you need to add the .js and possibly .css/.html file extensions to this.

for an apache web server, there would be an entry in the .htaccess file that looks like - 

<IfModule mod_headers.c>
	<FilesMatch "\.(php|js|css|html)$">
		Header set Cache-Control "no-store, no-cache, must-revalidate, max-age=0"
		Header set Pragma "no-cache"
	</FilesMatch>
</IfModule>

 

[gizmola]

This is a problem you will encounter when you have code in production and need to update it.   You'll need some way to "cache bust" files that users have already cached locally or they will continue to use the old version.

For development, if you develop using Chrome, you can install an extension.  I have used this one for a long time and it is safe and reliable:  https://chromewebstore.google.com/detail/clear-cache/cppjkneekbjaeellbfkmgnhonkkjfpdn

Make sure you set it up to pin the button to the extension window, and then when you need to test, you can click it will clear cached items for the site you are working on.