loading socket.io-client.socket.io.js fails when using ssl - node.js

I have developed a node js application which works fine as long as use http. Now I need to upgrade the code too be able to work ssl and I am having problems to load the socket.io-client/socket.io.js file. (The rest is working fine. I installed the certificates and the server works well)
Firefox fails with the following message: Blocked loading mixed active content "http://"url"/socket.io/?EIO=3&transport=polling&t=NX-uS5E". which is weird because the link states a http request.
Chrome fails with this message: socket.io.js:3511 Mixed Content: The page at 'https://"url"?' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://"url"/socket.io/?EIO=3&transport=polling&t=NX-s_OB'. This request has been blocked; the content must be served over HTTPS.
It seems that socket.io-client is trying to load a resource using http instead of https. Is that possible?
How can I correct this? Any idea?
I have been searching the web for two days noow and I have not come to any indication of someone else having this issue

Ok, after letting it go for the evening and having a good rest I checked my whole code again and found the error!
I had one obfuscated code line where I was using a http request instead of a https one. I had to correct this on both, the server and the client side.
I also had to include the port number on each of the calls and force the socket on the client side to use polling instead of websockets by adding the option "transports: ['polling']"

Related

HTTPS conflict with HTTP

HTTPS conflicts with HTTP
I make my first full-stack project on React and NODEjs and deployed it on netlify.
My backend server runs on HTTP localhost.
And here is a problem:
My app works on my Mac in Chrome but doesn't work properly on other browsers and computers.
Other computers can download index.js (display sign-up and sign-in pages) and it seems there is no problem with CORS but authentication doesn't work.
Safari logs mistakes:
[blocked] The page at https://MYAPP.netlify.appwas not allowed to display insecure content from http://localhost:3500/register.
Not allowed to request resource
XMLHttpRequest cannot load http://localhost:3500/register due to access control checks.
I don't understand why the app works on my MAC but
doesn't on other computers and can't find an answer on how to solve this HTTPS - HTTP conflict
I have tried to find a problem in CORS but it looks like CORS is ok. Also, I tried rewriting the server with HTPPS but it didn't work.
I've never worked with Netlify, so I could be wrong, but I suspect your problem isn't directly related to Netlify.
The Safari error message indicates that your frontend is trying to talk directly to localhost. localhost is an alias for "the computer that is making the connection attempt" under normal circumstances. This means that when someone runs your frontend, the browser tries to talk to the backend running on the same computer that the browser is running on.
This works on your computer in Chrome because you probably have the backend running on your computer for testing. Safari is only complaining that the frontend was loaded via HTTPS but is trying to talk to non-HTTPS servers. It is not stating that it can't talk to the backend, it's stating that it won't even try.
If I'm right and you shut down the back end on your computer, it will start to fail on your computer as well, even on Chrome.
If this is the problem, the solution can be one of two things: You can either run the backend somewhere where it has a domain name/ip address that everyone can connect to, or you need to run a proxy for your backend somewhere where it also meets those conditions, and has a way to pass the request on to where your full backend does run.
You need to find a way to run your backend somewhere other than your own computer or have something somewhere else proxy requests to your computer which then gets relayed to the localhost address. How you go about that will depend on things you didn't specify in the original question.

Bad Request - Invalid URL HTTP Error 400. The request URL is invalid. while using SSL on domain name and JWT token inside NodeJS

My URL is not working while fetching the data from Server. What I have done is as follows:
Created the Node JS application using Bcrypt and JWT tokens in IIS server.
I am using the access token in URL to get the data from server after validating the User.
While using the accesstoken it is displaying the data correctly with http request but not with https request.
Suppose, we have a URL whose data is http://example.com/Users/Accesstoken(length:350).
So this url will work but if we are replacing the http with https then it is showing the error
Bad Request - Invalid URL
HTTP Error 400. The request URL is invalid.
What I have tried are as follows:
I have tried using the maxURLlength in IIS to get the data, But it has not worked.
I have tried maxquerystring in IIS, this also not worked.
I have tried the port which I have used in nodejs application, this does work in http but not in https.
Now on increasing the limit of Maximum URL length under Feature Settings inside the IIS configuration request filtering settings also it is showing the ssl not secured.
Please help me out in knowing how this can be solved as I need the node js application for calling api and then I need those api's to be used in different applications like asp.net, reactjs, android, ios, etc.
I have found the answer to my own question. It is the issue of SSL not linked with my nodejs application. So in this situation, I have used the SSL configuration while creating the HTTPS server and it has solved my issue. This is the link to the answer https://www.youtube.com/watch?v=USrMdBF0zcg

Keep on getting Unauthorize Web API

I have a project, It's a web application that requires Windows Authentication.
I've setup an Active Directory at home using my NAS virtualization. Then I've created a VMWare Server for IIS which is a member of that domain on my desktop which I also use for development. I've created the Web API and installed it into that VMWare server. When I call a routine directly, it works and return results but when I use the Web API routine from my javascript web application I keep on getting 401 error. I then put the code on the IIS server and the web application works.
I've seen a lot of solutions like changing the sequence of the Provider in IIS Authentication. Added Everyone read/write permission on the folders. I've also added entry on the web.config. But none of them work.
*****Update as per request on the comment *****
Below is when I run directly from Web API
Calling the Web API from Javascript
Here's the error I'm getting
Just FYI, I tried running the web api from Visual Studio on the same machine but also with 401 error
Is there anything I could add to AD to make my development machine as trusted?
********************A new issue after the code change **********
****************Another Update******
This is definitely weird, so I installed Fiddler 4 to see what's going on. But still no luck.
Then I made changes on the IIS HTTP Response Header
The weird thing is when I run Fiddler the error is gone but when I close it it comes back.
There are two things going on here:
A 401 response is a normal first step to Windows Authentication. The client is then expected to resend the request with credentials. AJAX requests don't do this automatically unless you tell it to.
To tell it to send credentials in a cross-domain request (more on that later), you need to set the withCredentials option when you make the request in JavaScript.
With jQuery, that looks like this:
$.ajax({
url: url,
xhrFields: {
withCredentials: true
}
}).then(callback);
These problems pop up when the URL in the address bar of the browser is different than the URL of the API you are trying to connect to in the JavaScript. Browsers are very picky about when this is allowed. These are called "cross-domain requests", or "Cross-Origin Resource Sharing" (CORS).
It looks at the protocol, domain name and port. So if the website is http://localhost:8000, and it's making an AJAX request to http://localhost:8001, that is still considered a cross-domain request.
When a cross-domain AJAX request is made, the browser first sends an OPTIONS request to the URL, which contains the URL of the website that's making the request (e.g. http://localhost:8000). The API is expected to return a response with an Access-Control-Allow-Origin header that says whether the website making the request is allowed to.
If you are not planning on sending credentials, then the Access-Control-Allow-Origin header can be *, meaning that the API allows anyone to call it.
However, if you need to send credentials, like you do, you cannot use *. The Access-Control-Allow-Origin header must specifically contain the domain (and port) of your webpage, and the Access-Control-Allow-Credentials must be set to true. For example:
Access-Control-Allow-Origin: http://localhost:8000
Access-Control-Allow-Credentials: true
It's a bit of a pain in the butt, yes. But it's necessary for security.
You can read more about CORS here: Cross-Origin Resource Sharing (CORS)

Not able to make api calls using https to application on same server

I have deployed my angular application on a server using apache2 . This application communicates with a node application which is deployed on the same server which again communicate to a java application deployed to the same server. All the applications are running on different ports .
Now If I make a "http request like http::/path" I am able to get the response.
Now I have purchased a ssl certificate for my domain. From this i am able to access the front end but the api calls are failing.
I am making calls like "https:domainname.com:port/path" which doesnt work but If i do it like "http:ipaddr:port/path it works" from a rested client but on UI it throws error saying "he page at 'https://domain.in/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint http:ip:port" This request has been blocked; the content must be served over HTTPS.
not able to resolve this . Please suggest a solution.
you need to add proper CORS Header.
Take an look at https://developer.mozilla.org/de/docs/Web/HTTP/CORS
The error
"he page at 'https://domain.in/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint http:ip:port" This request has been blocked; the content must be served over HTTPS
is just a result of being on an https site and trying to make an XHR to a non-https site. So this error should disappear once you correctly set up https for all of your servers and configure your site to use the https://... url when making xhr.

HTTPS vs HTTP caching Javascript file?

I am developing on a server which was initially running HTTP protocol. After switching to HTTPS protocol, any changes done on the Javascript file won't update any longer. I've made sure that, the file was in fact saved properly, upload and re-downloaded the file to make sure the changes on the code were really there and, it was.
Here is my question, why https won't react to changes I made to the file but, as soon as I use http, the changes are displayed?
Your Javascipt source code appear to attempt to POST to an HTTP URL when you are using HTTPS. Most modern browsers block this as this is insecure. If your POST URL supports HTTPS, change it and you should see this work.

Resources