Nginx letsencrypt nodejs : this page is trying to load scripts from unauthenticated - node.js

I'm new to ssl setup and I was fallowing a tutorial on how to setup a node.js application with nginx and a ssl certification
"The tutorial":
https://code.lengstorf.com/deploy-nodejs-ssl-digitalocean/?utm_source=nodeweekly&utm_medium=email
Everything went well and I'm able to access the site via https but in Chrome at the right sidebar I can see this warning (This page is trying to load scripts from unauthenticated sources)
any idea of what may be?

This means that you have some HTTP links in <script> tags in your HTML.
You need all your links in HTML to be HTTPS (scripts, images, styles etc.)
Those could be links to libraries like jQuery, some analytics scripts or even your own scripts on your own page that get loaded with <script src="http://...">
For example, if you have something like this in HTML:
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.js">
</script>
Change it to:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.js">
</script>
This is also possible, but less likely, that you have some scripts that are requested over HTTPS but the requests get redirected to HTTP. Open the browser's developer console and see which requests for which files are causing those warnings and find out where they are referenced in the HTML that the browser is getting.

Related

How would I force my page to be loaded *only* in an iframe

I want to host a webpage that can only be served via iframes within my own domain.
An example of this in the wild would be Codepen. They sandbox the content of a "pen" in an iframe, but if you try to load the url from a browser it responds with an empty page.
I understand there might be multiple answers to this question but I'm hoping someone could point me in the right direction.
Would I be checking the referrer server side? Are there any other options?
Referer is a good start for the server side.
Also you can try using CORS headers:
Only allow iframe to load content
Or validating using client side javascript code:
How to identify if a webpage is being loaded inside an iframe or directly into the browser window?
Also check info about referrerpolicy
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-referrerpolicy

IIS and nginx/Varnish - Webforms can't load "WebResouce" over SSL?

We have put up a varnish server in from of IIS.
We configured IIS to serve non SSL traffic to Varnish and then NGINX proxies everything for us in SSL (rewrites non SSL traffic to SSL) from Varnish local proxy.
Everything seems to work fine except for a few of those webresource scripts.
In the HTML the script tag is as follows. Using a relative path like my other scripts, ie jQuery, which load fine.
<script src="/ScriptResource.axd?d=6uPUkgsnuI6bNNqsGNPwyYxfMKrscMZRBRF2qryQunH79WGeJKinT5LSOz4dgI3pMcYvAuAL2CF8edx8jqS5kzCUSBNhkgtxn779pz4r4s4-EUnJ08DyzAMEVy9czI-nbL_zTBJ0Y-62dvqDT5tm7XxUtSCilM9esKhQq3SfIxM1&t=ca758f3" type="text/javascript">
But then all browsers are saying the content is loaded from non secure and blocked
Chrome's request headers
I did a fiddler to see what is going on. It seems like there is a redirect 301 on the script, form http to https.. ok, both load
But why on earth are browsing trying to load the scripts from http:// is the script tag is set to relative?
This only happens on these 3 webresouce files, all other scripts, non WebForm load just fine

SSL: Insecure Content IE

I'm currently building a website for our business, where the website is expected to work perfectly, even back to the earlier IEs down to 7.
URL - https://secure.marietta.at
The page does not load any insecure content in Chrome, but I can see in IE that there is a GET param sent to http://marietta.at, which in turn redirects to http://en.marietta.at
I have no idea where I've specified this. I tried deleting scripts, checking the css, debugging with IE's own debugging tool and in HttpWatch Studio. I can't find the offending piece of code.
Are there any particular gotchas in IE that might trigger this warning?
Your HTML source contains the line
<script type="text/javascript" src="js/jquery.min.js"></script>
which makes the browser try to fetch the URL https://secure.marietta.at/js/jquery.min.js. However, this URL doesn't actually return any JavaScript code like you'd expect it to, but instead redirects to http://marietta.at/.
The fact that you later load another, working copy of jQuery from another URL hides this problem.
I would suggest either of the following solutions:
Remove the broken jQuery URL from the page.
Put an actual copy of jQuery at that URL so that it works (and remove the other, now redundant copy from the page).
I'd also suggest configuring your webserver so that it doesn't redirect from HTTPS to HTTP URLs, as that may violate the user's security expectations in general.
Load your page in IE and view the source code. There are quite a few hard coded references to http://en.marietta.at. Seems like some of your jQuery calls might be loading that "insecure" content
Ok, I've figured it out - never load JQuery twice (esp. from with an invalid URI). I've mistakenly left it in the <head> and just above the <body> tag which resulted in the SSL error. Deleted one, which got rid of the error.

Cross-domain HTTPS resource access

I know that if you access an HTTP resource within an HTTPs page, most browsers will warn you. Are there any issues regarding loading a resource across HTTPS from foo.com when the page is served on bar.com?
For example, assume the following page comes from https://www.bar.com/index.html:
<html>
<script src="https://somescript.foo.com/foo.js"></script>
</html>
No, there are no issues.
This is common practice in PayPal shopping carts, where PayPal includes the user's logo from a 3rd party site via https://

How to identify mixed content in https website

I've inherited an ASP.NET web site that has an SSL certificate bought via GoDaddy.
The problem is that the certificate seems to be invalid because of some "mixed content/resources" (I think that's how its called) coming from http sites.
Chrome is showing the red cross over the lock next to https, meaning it's unsecured. The popups says the following:
Click in "What do these mean?" goes here which says:
The [crossed-lock] icon appears when
Google Chrome detects high-risk mixed
content, such as JavaScript, on the
page or when the site presents an
invalid certificate.
The certificate is correct and valid because I tried creating a blank "Hi world" .aspx page and it's showing the green lock with no problems.
Reading a little bit, I found that I should only include images and javascript coming from https sites. The only thing it had coming from http was the addthis widget, but they support https, so I changed to https, but it's still saying that is unsecured.
I've searched for anything else coming from http in the source, but didn't find anything.
Is there some way (site, chrome extension, firefox extension, whatever) that will show exactly which are the resources that are "unsecured"?
I've never dealt with SSL/HTTPS certificates, but I need to fix this issue asap.
Check your site in http://www.whynopadlock.com, which will give you a list of url which is not consider as secure by your browser.
Check the chrome console
You will get it like this,
The page at https://xys displayed insecure content from http://asdasda.png.
Make it http site to https then it will work.
I've found the problem using the Chrome Developer Tools. It was a js that's embedding a flash from an 3rd party site which it's using http.
Are you on Windows? Download and run Fiddler while browsing the site, and watch for HTTP connections.
Mixed content means contents of a web page are mixed with HTTP and HTTPS links.
These links include your JS, CSS, Image, Video, Audio, Iframes etc.
If your website is enabled for HTTPS (SSL certificate has installed), make sure you serve only HTTPS contents throughout your web page.

Resources