Static files not loading properly 50% of the time - google-app-engine

when i load my site from incognito (when static files are not caches), about 50% of the time some static files which are hosted on app engine are not showing up. one time it can be a CSS file and other times it's JS. in the console i see this error:
Failed to load resource: net::ERR_CONNECTION_RESET
I have no idea why this happens and how to fix it.
Also, when you first go the page, you sometimes see a message saying the page is unavailable, and then immediately the page appears.
How to reproduce:
open this page on incognito (each time): http://alephz.com/
about 5 out of 10 times it should come up without CSS or JS

It might be the DNS prefetching having a problem. Try disabling it by adding <meta http-equiv="x-dns-prefetch-control" content="off"> into your header. Have not seen that being a problem for a while though.

The root problem is a certificate mismatch / expired certificate.
You can see this for yourself in the code here.
Note in particular the use of the very constant you reference in the code on line 44 of the C++ file in above link:
case net::ERR_INSECURE_RESPONSE:
The current version of this file is here. The error status ERR_INSECURE_RESPONSE may not any longer be on line 44 but the error code still exists in the SSL certificate portion of the code.
But as you are requesting the resources over SSL it is likely the certificate is invalid. Either it is self-signed and has not been added to your browser/OS exceptions or it is otherwise invalid.
Try the URI directly in the same browser and inspect the certificate.
This is in no way related to jQuery, JavaScript or CSS directly.

Related

How to migrate an online angular script to local server?

Hi I'm trying to make an offline version of this page:
https://u-he.com/tools/microtuning/ the script is writtin with Angular JS how do I do that?
I saved the page control-s and copied the file to the local server I'm running.
And then I browsed the local ip. the page opened but I get repeated notes ng-repeat shows up as multiple boxes instead of 1 box that edits the same note but in different octaves.
How do I solve this problem please.
You can inspect the front-end code in your browser console. In Firefox it's in the section called "Debugger", in Chrome it's called "Sources". If you use Safari, you need to enable Developer mode first.
Once you have the appropriate view, just click on u-he.com -> tools/microtuning/ -> index
Hopefully it goes without saying that you shouldn't use large swaths of another person's code without at least giving appropriate credit, or better yet getting the developer's permission, unless there is an explicit open-source license.

Why am I getting a 'Failed to find a valid digest ' error?

In my reactapp created by create-react-app I suddenly have an error in chrome when I try to run my app:
Failed to find a valid digest in the 'integrity' attribute for resource 'http://localhost:3000/static/js/0.chunk.js' with computed
SHA-256 integrity 'hW0einVybma+FCDLYbayWASTmGI9JBE1dkrmPvDzJXQ='. The
resource has been blocked.
However in IE it works fine. All I did was changing a label on a Button component. How can I avoid this error on chrome?
It sounds like the feature is simply doing what it's intended to do.
Do you have compression enabled in your Chrome for Android browser?
Google may be minifiying your CSS before sending it to your phone causing the signature to be invalid.
SSL prevents this from happening. Maybe we should look for https in PUBLIC_URL and toggle this feature based on that.
https://developer.chrome.com/multidevice/data-compression

localhost serving old file saves

First, I apologize that I don't fully understand what's going on here. I am new to AngularJS and I am building an app that I am running on localhost:3000. I make changes to my files, and I refresh the localhost:3000 page.
But after a few times of doing this, my changes do not get passed to the server.
Upon inspecting the developer tools, I see that it is using an older version of the file that I have overwritten with new code. No matter how many times I refresh the page, the changes do not get passed to the server.
If I come back after a few hours, it gets all the changes like it should. But only the first time, because every time after that I have the same problem.
I've tried restarting the http-server, I've tried closing and opening the editor, closing and opening the tab, restarting my computer, but none of these fixes the problem permanently.
If you need any more information, I'll edit it into this question. Thanks!
Try clearing your browser cache
Either
ctrl + f5
or
Right click on refresh button and choose the last option (hard reload)
(only in chrome, I guess)
That's almost certainly a caching issue.
You need to look at the network traffic when the page is downloading.
How you do that will depend on the browser you use, but try pressing F12 for a start
Check the RESPONSE headers for anything "cache"
Also check for a Status code of 304 - "Not Modified"
That might reveal to you instructions from the server to the browser to cache the file for a few hours, or that the browser is being told the copy it has is up to date.
Alternatively it might be server side caching, in which case I can't help you much.
One other solution is to change the file reference to include the date modified as a query string.
e.g.
instead of
src="/scripts/myscript.js"
use
src="/scripts/myscript.js?dt={filemodifieddateformyscripts.js}"

Chromium fetching all my favicons all the time

When using chromium, in my angularjs application, when I click on any link, all my favicons get loaded.
My main HTML page contains 10 lines like
<link rel="icon" type="image/png" href="favicons/favicon-57x57.png" sizes="57x57">
with size going up to 192x192. This might be wrong as it's just an "adaptation of something I found somewhere".
However it doesn't explain, why all of them get loaded every time, does it? All the links just change the URL after the hashbang and usually lead to no server request at all, apart from fetching 10 favicons.
Even if I did everything wrong, the favicon is global for the whole site, so there's no need to reload it, right?
With a little fiddling with the headers I can serve them with any of 200 OK or 304 NOT MODIFIED or 200 OK (from cache), but whatever I do, they all always get requested.
This doesn't happen in Firefox.
What you described is a known issue of Chrome, related to the fact that Chrome doesn't support the sizes attribute.
Firefox also used to be impacted, and it still doesn't support sizes. However, it doesn't load all icons anymore. As far as I know, this is not documented anywhere. This may have been fixed as a side effect.
There is no "solution" but a workaround: declare less icons. I suggest you to use this favicon generator. The generated images and HTML were designed with this issue in mind. For example, it does't generate the 192x192 PNG icon by default, because Android Chrome (the browser it is dedicated to) primarily uses the Webb App manifest. Full disclosure: I'm the author of this service.

angularjs error on IE only with no debug option

I have an angular application that run ok on chrome and firefox.
But on IE the application does not work.
My Big problem is that I can't find the error reason. and got some generic error.
How can I debug the application on IE or how can I find the reason for the Error
This means that ng module is failing to load. :)
Please look at your browser's console to find if any files are missing or not being downloaded correctly. Also it helps if you click on the link to http://errors.angularjs.org in your console, it will give details about which particular module is failing to load.
Check below link for complete details for resolution:
http://blog.technovert.com/2014/10/dependency-injection-fails-angularjs/
IE Debugging : First of all you need to ensure your Angular application works on IE please consider the use ng-style tags instead of style="{{ someCss }}". The latter works in Chrome and Firefox but does not work in Internet Explorer <= 11. Arguably, this is the biggest annoyance of IE—the page just doesn’t load and doesn’t give any errors. Sometimes you need to view the page again in Firefox. If it’s not an IE specific error, Firebug will pick it up. If Firebug loads normally, the chances are it’s one of two IE specific errors: a trailing comma, or unsupported XML syntax.
For minimize the application files I use
bundles.Add(new ScriptBundle("~/app").IncludeDirectory("~/Assets/app", "*.js", true)
);
(Part of asp.net mvc)
And from the layout page I take all the application files
#Scripts.Render("~/app")
Like I said this part of code worked for me in some browsers, But on IE It fail.
By Changing the script src to all specific files, I resolve this problem. and now on IE it work like the other browsers.
Maybe I miss a comma or ";" (end row) or something like that.
Thanks
need to check this page or api
http://henriquat.re/appendix/angularjs-and-ie8/necessary-changes-for-ie8-compatibility.html
https://docs.angularjs.org/guide/ie

Resources