I have a set-up using templates from my CDN, that usually works fine but periodically I get this error:
ng-error: Error: [$sce:insecurl] http://errors.angularjs.org/1.7.5/$sce/insecurl?p0=https%3A%2F%2Fcomplicemail-herokuapp-com.global.ssl.fastly.net%2Fstatic%2Ftemplates%2Fviewschedule.a15ce4bf.html
I grepped the codebase for viewsched, and literally the only two places in the code where that template are my precache list in my service worker, and this line in the angularjs file:
$scope.scheduleTemplateUrl = $sce.trustAsResourceUrl('/templates/viewschedule.html')
Gulp turns that line into the one that references the CDN:
$scope.scheduleTemplateUrl = $sce.trustAsResourceUrl('https://complicemail-herokuapp-com.global.ssl.fastly.net/static/templates/viewschedule.a15ce4bf.html')
I know that part's working because the insecurl error shows the CDN url.
My first guess that the issue is something like "for whatever reason (eg shoddy internet) the browser couldn't connect with the CDN at that moment and failed to fetch the file, giving some sort of HTTP response code that AngularJS considers insecure. But I think that would produce this issue (which I also periodically get)
ng-error: Error: [$templateRequest:tpload] http://errors.angularjs.org/1.7.5/$templateRequest/tpload?p0=https%3A%2F%2Fcomplicemail-herokuapp-com.global.ssl.fastly.net%2Fstatic%2Ftemplates%2Ftimer%2Fuser-other.27734af8.html&p1=-1&p2=
Any ideas? Also interested in ideas for how to more gracefully handle the tpload error situation in cases like this where the url is correct but the internet just conked out at that moment.
Related
I have angular 8 front end application in production and its Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
This issue is happening only in production build that too not always , able reproduce only sometimes.
main-es2015.fcc7123d15fd9c113b00.js:1
vendor-es2015.d8d7d81cc2b06ece8c91.js:1
How do i fix it.?
Are you using serviceWorker?
If so you have to add inside angular.json "serviceWorker": true for the configuration that you are using.
I would like to share my experience with the same issue I was facing in the organization where I'm working.
I had an Angular 9 application and when I deployed to Stage environment, I got three errors in my console which showed as "module not loaded due to Mime type". This was working fine in all other environment and after much struggle, it was found that the files under the website were not having access. E.g. When you deploy an Angular application, you will get index.html file and many other js files. The website had permission issues. The site was hosted in the Rackspace and the FireWall was not configured to have access to the files right under the website.
Once the below access was provided, the app started working.
/assets*
/*.css
/*.js
/*.ico
/*.html
The only difference I see with your problem is that you have mentioned it is working sometimes.
There is another post Blocked because of a disallowed MIME type (“text/html”) : Angular 8 deployed on tomcat 9.0.30 fails to serve the assets try the solution based on base reference as those js files are not served/loaded
I hope this might help someone.
I have an Angular application that is leveraging template caching (part of our Gulp build process). The application runs fine, the cached views load... Except when rendered through PhantomJS (or Google's Pagespeed or Fetch as Google for that matter).
After much investigation, I found that routing is throwing this error:
Error: [$compile:tpload] Failed to load template: /static/app/public/views/about.html (HTTP status: undefined undefined)
I am assuming the HTTP status of undefined is related to the fact that no round trip is occurring... but I can't find any information on why this would fail, and especially why only when using the above mentioned tools.
To summarize:
App runs fine on Chrome, IE, Firefox, Opera
The cached template .js file contains the necessary path and html content
The path fails to resolve when loading through PhantomJS, Speedtest renderer, or Google's "Fetch as Google" tools
I have reviewed the Angular documentation on why this error is thrown, but it still doesn't make sense, the template has been populated (as the file template .js has been loaded)
Edit
I added the following line for debugging:
var about = $templateCache.get('/static/app/public/views/about.html');
console.log('about', about);
... and I see the proper output in the console log, even with PhantomJS.
It turns out that I was ignoring another error message:
Error: undefined is not a constructor (evaluating 'newUrl.startsWith(target)')
... happening due to PhantomJS's ES5. I didn't think the two issues were related, but after providing a polyfill for String.prototype.startsWith, the issue went away.
Please keep in mind, I have not worked with angular JS, nor did I write the code that is causing the error.
I am getting an 404 error on this path:
https://www.helivalues.com/Su6UsWuf/bb/option/mfg/all
but not this path:
http://www.helivalues.com/Su6UsWuf/bb/option/mfg/all
It was noticed that when a user views a certain page in https, the drop down does not load options. Angular Js makes a call to the path mention above which is not an actually file but is used by a php file that based on this path, has a switch that fills in the drop down.
Any ideas on how to get the https version to work? This is on a joomla site and I do have access to the htaccess file if needed. I really just need it to work for a few months while I work on building a new site.
Thanks!
Angularjs is not the issue. Your webserver (Apache/2.2.15 (SuSE) Server at www.helivalues.com Port 443) states the file can not be found. So it looks like something is misconfigured with your apache site.
Background:
I'm loading my entire AngularJS Cordova/Ionic web-app from the server. This is amazing. I can change the app without going through Apple.
Questions:
Q1) How can I use js-files.zip, loaded from server, in my index.html file?
Q2) How can I effectively load index.html startup logic from my server?
Problems:
On some older devices, loading time is too high if I load all my .js files from my server, so I want to be able to configure that logic (in index.html) also from the server.
The only thing I'm not loading from the server is the content of index.html
So, how can I essentially load index.html from a server?
If i try to do that
1) Pulling, say, indexfromserver.html using ajax and doing html rewrite of index.html with document.write(res), then there are AngularJS problems:
E.g., module missing errors (*1 below), because the following isn't in index.html until after the ajax response rewrites index.html:
<body ng-app="myapp" ng-controller="MainCtrl">
1.1) I can include the necessary modules in the initial local index.html, but then if I rewrite index.html, I'll get these errors/warnings about classList null in ionic (ask me for details), deviceready not fired, and angularjs loading more than once
2) I can redirect index.html to, say, indexfromserver.html, but then all my $http responses are rejected promises.
Regarding 2) I've been told I should be able to add a controller for indexfromserver.html or specify $urlRouterProvider.otherwise('/app/indexfromserver');
This hasn't fixed the $http requests from being rejected.
I don't understand exactly how index.html is involved in making $http work correctly, as it doesn't have a controller and isn't the 'otherwise' route provided. I only see mention of index.html in config.xml so far.
Request:
Can someone please post a snippet of a typical example how an AngularJS Cordova/Ionic app could effectively use index.html logic that's loaded from a server?
Otherwise, can someone show/explain if/how I can use js-files.zip from server, and uncompress and use in index.html?
Details/Notes:
(*1)
Uncaught Error: [$injector:modulerr] Failed to instantiate module myapp due to:
Error: [$injector:nomod] Module 'myapp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.2.17/$injector/nomod?p0=myapp
It was pointed out that you can use JavaScript in certain situations to unzip an archive, but that is not very common. The web does not work like that, Ionic runs inside of a browser so you should use the same processes as you would to optimize a website.
You would build the app instead like any website. Take the following steps to create a more optimized app for loading quickly. If you aren't familiar with build tools, take a look at http://yeoman.io/, and this specific generator for Ionic https://github.com/diegonetto/generator-ionic.
Here is a very basic list of some steps you can take, though the generator provides a few more options and other things could be added as well.
Concat and minimize your app's JavaScript into single file.
Concat and minimize your app's CSS into a single file.
Compress your angular templates with a tool like this https://www.npmjs.org/package/grunt-angular-templates into a single JS file.
Deploy static assets to server.
Link to above assets in index.html.
Ultimately the goal is to optimize the assets so you don't have to load a lot of files, and each file is as compressed as possible.
If you want to go the zip file route, and you assume your users aren't always connected to the internet, probably the best way is to:
Check if the version is new via a server call, and if so, download the zip file, extract it (maybe via stuk.github.io/jszip/), and use a Cordova interface to write the new JS code to the phone's memory, and run the code by adding some script tags in your loader.
I'm trying to get TileStache to generate some tiles but it is not making the call to the url template that I've specified. The TS docs say that I can enable logging in the config file by adding "logging": "debug". I've done so, but am not seeing any sort of logging anywhere. Any suggestions?
You can see the errors that are generated throught the web server log. if you are using apache wsgi, you can see then in the apache error log file. If you are using Werkzeug wsgi, you can see the errors that are generated throuth the console. Sometimes it helps to watch the responce to the request from firebug.
Most of the time the error is due to a missing dependency or in the wrong url template.