JavaScript function not working due to cached JS file - javascript

I have a few JS files which I need on every page in my admin panel, like: functions.js, login.js, ...
I combine all those files (and minify them) into one file using gulp: admin.js
Two days ago, I have made a new function called "changeTicketStatus", but there's one problem: cache.
Whenever someone visits my website, the new function does not work yet.
When they visit http://website/js/admin.js manually in the browser, they do see the new function.
When they check via sources (in chrome dev tools), they do not see the function.
Since we are using CloudFlare for caching, I thought this might be the problem, but we already purged all cache on CF and it is still not working.
The people who are trying to visit my website have already cleared their cache too. It does work in private mode (incognito), so I guess it should be something cache related... I just think it's really weird that even after clearing their cache, the function's still not appearing in dev tools.
I would really appreciate it if someone could help me. I'm out of ideas, I really don't know how to fix this.
Kenny

Can you add a random querystring to end of include script
for example:
instead of <script src="app.js"></script>
use this <script src="app.js?v234123"></script>
This will solve your problem about caching.

Related

What am I doing wrong with Angular js manual bootstrap process?

I am using Angular 1.7.2 in a project i'm working on. (I prefer Angular 1.x)
I am doing the bootstrap process manually (because i'm adding scripts programmatically).
But, I am having 2 issues with the manual bootstrap process.
I have to use a setTimeout, else the bootstrap never works. And my problem with this is, the more files I add to my project, the longer i have to make the timeout.
Sometimes when I load my web page or refresh the site, not all my components are loaded. If i monitor the network traffic, i can sometimes see that the html files are not retrieved at all. And there are no errors in the console or anything.
It seems to me there must be something happening in the angular.boostrap process that is failing or getting stuck, but i can't figure it out.
For my first issue, why is the setTimeout required, is there a way to not need this?
Second, why does my site not load sometimes?
Could it be related to the OS locking the files temporarily because of all the source control, anti-virus, other services running on my computer? If so, how can i tell?
I put together a test project with relevant code here on github
I previously thought this was related to the routing, but it's not (see here), But it seems not related to angular-routing after all.
Any information would be much appreciated, this is driving me mad.
Update 1:
I have the code running here on github pages.
Best chance to replicate issue is to use google chrome, enter url, open dev tools (f12), then actually load url. Sometimes, the page doesn't load completely.
I have updated the test website to better reflect my project where I add scripts dynamically.
I think i found the solution thanks to a comment by igor
I moved my app.route.js file to be loaded before any of my angular component and directives and from what I can tell this solves my problem.
I will update the linked sample project too

Javascript files not loading consistently?

We have a .net web forms application, running on iis on our own server that has show some strange behaviour in the last 24 hours.
Rollbar notified me of multiple errors all saying certain js functions/variables can't be found from a host of users - essentially breaking the app. I've come into work today, loaded the site up in chrome dev tools only to find it did not have any source file shown, and therefore no js files to load/step through (css & image files are there though).
To make matters more confusing, after refreshing the page everything is there as it should be?!
An updated build of the app was released yesterday, so I'm guessing that has something to do with it?
Honestly any speculative pointers on things we can look into to prevent it happening again would be appreciated.
If you have multiple javascript files and your code is running before its dependencies are loaded, then you get 'undefined' errors.
After page refresh the dependency files are already cached, so they load immediately, almost synchronously. That's why you dont get errors next times.
Try to disable cache in devTools and reload it a few times checking if next attempts are still working.
If that is the problem, you might consider modularizing your JavaScript code and loading it as asynchronous dependencies, for example by using browserify, webpack or even require.js. Anyways, you can find more in the subject looking for "javascript load order".

issues when going to www vs not going to www

I'm working on my dev box and noticing that I'm having issues when I go to www.host.com vs host.com.
Specifically, I had a javascript hover effect that isn't being applied when I go to www.host.com however it works when i go to host.com.
My thoughts are that its a problem with the server and when I merge to live it will resolve itself however I am not quite sure if thats really the solution.
Has anyone ever experienced this and what should I do?
You have to check your JavaScript code in both of domain (www.host.com and host.com) because the browser usually will cache your JavaScript files to make it load the page fast rather than always take from the server. If you want to clear the cache, you can try to Ctrl + F5.
More over, to easily make your JavaScript code updated automatically when you deploy your new code in JavaScript, try versioning your JavaScript files (i.e. myCode_v_2_0_1.js) to force the browser to load new JavaScript source.

MVC Bundle fails to load

We're having a strange problem that we can't seem to find a cause for. What seems to happen is the javascript and css bundles no longer load on the page.
When we initially navigate to the page everything seems to be working fine. After two page refreshes the page loads without any css and the javascript files are loaded incorrectly. Navigating to the javascript file in the browswer shows it loaded like this:
‹������ì}{·Ñàÿú°£÷È)JNÚk„ö#[ÊEï9–Î’›·§ªéŠ\I›P\–»´¬Ôêg¿™Á¯,vIÊŽÓ÷ëéÓ˜`�ƒù…Áöç6ÔçêYQTe5OgêÍ—ý/ûPÝ«ªš
¶·/³êÜ–õGÅu‚µŸ³Ûy~yU©/v?Þ‚ÿû£:¹É«*›÷ÔÁtÔÇJ/òQ6-³±ZLÇÙ\ýpp¢–5¯®ço»º9/·]Ûç“â|û:-Ôö‹ƒçû/÷±ËíüBu«ÛYV\¨ŸÿÏ"›ßªáp¨:ý"ŸfãN¢þ¹¡Tu5/nÔ4»Qûóy1ïvÜÔþÚ)Õ¦oÒãÑ<ŸUjžýc‘ϳÒ#ë$w.ÓQ•SÕÝÔð:‹2SÐ>Uoà÷›t®ÞdóëÕfÿbÚÿù Î&yÕí¨Nrºsfõ®R8ö®i…ê[õ…úÿÃÂ9}Œ¾NÔ»wŠ×‚é=ªÁ§¯ù§/°åãDõþ“w3zÜÿºÿXsuË›Íiðww]]-ùfccûsÄûù„7PðÿÓ2Gä÷.
b•JÜþ¦SÒt¶?ómKlò!Gøñ‰ýƒ
ŸöÍRš†ÛÛêùñ±:yµûòøàäàð¥:~}ttø
fq|U,*øßÀ®ÃÍÍMÿº€YNó_ç4«DCx/D7L¿˜ûÓq×Ò6n¼l{n\Œ×Ù´êæYZeû“u;¯#µ®Á0ûo ÎËôH~h�õcvþK^¸îÔ#un‚oжÓ3õ(~e•áêûÁf¬æ¡¬G5Tñ–UаÞU¼ÓS¼€­ÚÅyNajŸF書é"Ê&ý²ºd§ØàL=�"qÔ×TÀ ªÅ|ªþ© ÇAªigÜñA™¶éÈ#{¼p”W4Ú<ûJu•êÿÔ×¼EÓŽ¡-Ø—ýt’½½NG£ô†¨kT–[b{k¦›]/&°ú§CODÝñbžâ¿8ýŒÒÉ$£j86÷y“誺ÊKú´ÙÅ&}#7PUÐë#{Õ|‘©»DôužŽ~ƒÂ¸t³ú‚Γ>ìÅËËlÞÝì—‹Ù¬˜W}Æ
a ƒá2«Nòëöc×Âï)7SŽ}3BðfWŒ#O2ÒÍBì=½ 4âXƒÄô¶a#fHpôe£<ôÔ±wžOÇ'p–TÓ„ívg“ì×y¥ÚWét
The entire page is like that.
My best guess is that somehow the files are being compressing twice and the browser is only decompressing once. I don't understand why on initial page load everything is working correctly.
Notes
We've tried setting debug = true and debug = false in the config, which has not seemed to work.
Our dev and local environments seem to work fine but prod and staging environments do not work.
The web config files are identical between environments except for connection strings.
It would be great if someone could help us out. Even better if it's just something easy and stupid to fix.
Thanks in advance
So I got something working, it appeared that somehow one of the javascript bundles had duplicated (kind of a weird process as we have internal nuget packages containing bundles along with the web application also containing budles...). I'm not sure why this was causing the strangeness in the files being delivered, but once I removed the duplicated bundle it appears there is no longer an issue.

JS Injection in Wordpress

I just upgraded to WP 4.3.1 on one of my websites. After upgrade (which seemed to go with no problems at all), I noticed that the layout of my pages has changed. There is a bar across the top of my page (not the admin bar) that wasn't there before. When I inspect the element there, I see a whole bunch of new code that is not being created by any of my plugins. And I cannot find the source of this injection in any of the provided php files. I have no idea where it is coming from, but I suspect that something in the WP 4.3.1 package has been compromised, or maybe there is a callout to a site somewhere that injects this code.
Anyway, this is a BIG problem and I don't know how to fix it.
I've copied the injected injected code below. It appears in all the pages on my site, right below the tag. Interestingly it can only be seen by "inspecting element" in the browser; page source does not reveal it (I've added some line breaks to make it more readable, but this is exactly what shows up in my page.
This same problem occurs on every site where I upgrade to WP 4.3.1. I hope someone can fix this problem IMMEDIATELY!!
Clearing cache, history & cookies doesn't resolve the problem. I can't tell where this injected code is coming from. Also, Google doesn't seem to be much help in telling me anything useful about http://kfc.i.illuminationes.com/snitch, which is one of the links that is being created.
Our site was infected, this is what we did to get rid of it
Thanks to this discussion which led me to a more detailed one
Connect via ssh to the server
Check the directory structure and find out recently created / modified directories
Check recently modified files for <script>. I found many files having JavaScript inserted which would connect to external sites.
As these calls were made on each page, I checked header.php in wp-content/themes/your-theme directory. (check the ones you are not using as well as that might be infected but may not show in radar)
You might also want to check footer.php for infection.
Re check file permissions on server as per WordPress Hardening guidelines on Codex
Delete unrequired ftp accounts in FileZilla (or its equivalent)
If you use any caching, delete entire cache.
You can verify if this worked using devtools network tab.

Categories