AJAX,PHP call HTTPS SSL CERTIFICATE TO REST SERVER - javascript

I have constructed a node.js REST server https://server.mydomain.com. And i am using html/javascript/php for the front end, when i implement SSL certificate on the front-end i run into the following problem:
Mixed Content: The page at 'https://front-end.url' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://sistema.url/'. This request has been blocked; the content must be served over HTTPS.
I need to make REST requests to the server over https: right now i am using this with http: but i can not find ajax ssl cross domain requests, is this possible? or how can i do this?
this is one example of my requests
$.ajax({
type: "PUT",
url: url,
headers: {
'token': token
},
contentType: "application/json",
data: JSON.stringify({
name: name,
}),
}).done(function(data) {
console.log(data);
}).fail(function(data) {
console.log(data);
});
});

This restriction was purposely implemented to prevent inadvertent use of non-secure content in what is to be a secure conversation. The resource must implement "https" so that it can be retrieved using a secure connection.
Now that we have "LetsEncrypt.com" to hand out secure (albeit short-lived) HTTPS certificates at zero cost, there really is no excuse anymore not to use HTTPS in your websites. (Automated software is readily available to periodically renew your certificates.)

Related

No 'Access-Control-Allow-Origin' header is present on the requested resource in simple html form

why this error is showing in my simple html form, I want to get xml data in my simple form to show news on my webpage, but this error is showing continuously, please help
$.ajax({
type: "GET",
url: "https://news.google.com/rss/search?q=Nigeria&hl=en-PK&gl=PK&ceid=PK:en",
dataType: "xml",
success: function(xml) {
console.log(xml)
}
});
It is up to the server that has the resource to allow cross origin access.
Probably there is API for what you are trying to do. API gets implemented by the resource owner and provides controlled access.
Or you can use RSS if there is one.
What you could potentially do is run your requests through a CORS proxy. For example:
$.ajax({
type: "GET",
url: "https://cors-anywhere.herokuapp.com/https://news.google.com/rss/search?q=Nigeria&hl=en-PK&gl=PK&ceid=PK:en",
dataType: "xml",
success: function(xml) {
console.log(xml)
}
});
You can see that this works by simply pasting this code snippet into the console.
This essentially bypasses the CORS issues for you. I would only recommend using this hosted version if you don't have a lot of traffic, otherwise you should host your own version of the CORS proxy.
This is because of CORS(Cross Origin Resource Sharing) policy implemented by browsers. Which means browsers doesn't allow certain requests to be sent from a domain to another domain. However this is not applicable to all type of requests.
Check this link to understand what all requests come under this policy
Inorder to make this work , the other server, in your case https://news.google.com, have to setup in such a way that it allows cross domain requests. This is achieved by servers telling the browser that it is ready to accept cross domain requests from your domain, by adding certain cors related headers. One such is Access-Control-Allow-Origin. But I am afraid you can't do it since you aren't the one managing this server.
Work-Around
Use your backend to send the request to google. So that your xhr request calls your server and your server calls google. No browser No Cors.
xhr---> yourdomain.com/news/get---> someotherdomain.com/news/get

Javascript/JQuery Send custom header in OPTIONS Preflight API

Code dump:
$.ajax({
type: 'GET',
dataType: 'json',
url: api,
xhrFields: {
withCredentials: true
},
beforeSend: function (xhr) {
xhr.setRequestHeader('Authorization', "Basic [my auth token]");
},
success: function(jd) {
console.log(jd.stringify());
}
});
The problem is that Chrome and Firefox send an OPTIONS preflight when I include a beforeSend, however that OPTIONS request is refused by the API because it doesn't know how to handle an OPTIONS request and treats it like a GET, sees no Authorization header and refuses the request.
The only way I can get this to work is to coerce the browser either to not send an OPTIONS request or include my header with it. I am unable to modify the API that I am using.
I would appreciate it if anyone could advise me.
The reason why browser sends preflight request is that you are using custom headers. Please. read about how to avoid preflight request (content type should be text or html and no custom headers)
If you could not chagne server side the last chance to make it work is to create your custom proxy (for example you can create node server and that node app would take your requests and forward them to those Api Then you will have you own server even in the some domain and this proxy server will send CORS requests to another server domain.

How to set up CORS in an AJAX request

I have been working on a personal webapp and have hit a little snag. My API calls only work for some APIs and not for others. For the ones it doesn't work with I will usually get an error message like so.
XMLHttpRequest cannot load https://api.meetup.com/2/cities. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
After doing some research I know it is to do with CORS not being setup. I was wondering if it would be possible to set this up in the client when making an AJAX request. The current way I am doing this is like so
var handleRequest = function(request){
$.ajax({
type: "GET",
url: request,
success: function(data) {
var rawJSON = JSON.stringify(data, null, 2);
editor.setValue(rawJSON);
},
dataType: 'json'
});
The server you're trying to access has to grant you permission to access it. An IT admin has to provide you with a URL that grants you permission to hit their external server. The server you are trying to hit has to setup CORS. http://enable-cors.org/
According to their docs they support JSONP.
https://www.meetup.com/meetup_api/
This is your way around CORS.

Howto get and post data via jQuery from JIRA REST API?

We are using JIRA 6.4.5 in our company but I am struggeling fetching data from its API REST interface. I have been trying now for the last couple of days, getting stuck on a cross-domain problem or that I don't know the user credentials so I cannot do any server-side either.
Ideally I am having a jQuery page where the user will use his own credentials/session for querying the JIRA data. The JIRA REST API is located at srv1.mydomain.xyz and I am using srv2.mydomain.xyz as my webserver with my code.
I have read the JIRA REST API Reference.
I have tried various Javascript/jQuery stuff - in the below example I am trying to submit 1h 30minutes to a specific issue:
$.ajax({
url: "https://srv1.mydomain.xyz/rest/api/latest/issue/proj-3/worklog",
dataType: "json",
method: "post",
data: { time: "1h 30m",
comment: "Test" }
}).done(function(data) {
alert("Success");
}).fail(function(jqXHR, textStatus) {
alert("Failed");
});
I get this error:
XMLHttpRequest cannot load
https://srv1.mydomain.xyz/rest/api/latest/issue/proj-3/worklog?time=1h+30m&comment=Test.
No 'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'https://srv2.mydomain.xyz' is therefore not
allowed access. The response had HTTP status code 401.
I then looked more in to this and saw that Atlassian has something called Atlassian Connect so I tried with this:
AJS.$.ajax({
url: "https://srv1.mydomain.xyz/rest/api/latest/issue/proj-3/worklog",
type: "post",
dataType: "json",
contentType: "application/json",
xhrFields: { withCredentials: true },
async: false,
method: "post",
data: { time: "1h 30m",
comment: "Test" }
}).done(function(data) {
alert("Success");
}).fail(function() {
alert("Failed");
});
But I get a similar error:
XMLHttpRequest cannot load
https://srv1.mydomain.xyz/rest/api/latest/issue/proj-3/worklog.
Response to preflight request doesn't pass access control check: No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'https://srv2.mydomain.xyz' is therefore not
allowed access.
I have also looked in to if I could do this server-side from my PHP enabled server in the same domain as the JIRA server but as I don't get the base64 encoded credentials when doing a phpinfo() then I don't think I can use this approach either (and I don't want to prompt the user for credentials).
I am painfully aware that my problem is related to cross-domain protection but I cannot find any examples on how to fix it? It would be great if the JIRA server could set a Access-Control-Allow-Origin for certain hosts but I assume this is not a configuration option (I am not in control of the JIRA server).
This is definitely a cross-domain case. And believe me, it exists for your own protection ; )
The method I use is to send the jQuery request to a server-based processing page, which then authenticates and interracts with the Jira server. In your case, since srv1 and srv2 are under the same domain, srv2 (webserver) can talk to srv1 (Jira) using internal IPs (https://10.50.25.87:8080/rest/api/latest/issue/proj-3/worklog, for example) so the cross-domain issue doesn't apply.

Origin http://XXXXX.com is not allowed by Access-Control-Allow-Origin

I am trying to make a request to the yahoo wheather forcast like this
function parseXml(woeid)
{
$.ajax({
type: "GET",
url: "http://weather.yahooapis.com/forecastrss?w="+woeid,
dataType: "xml",
success: parse_wheather
});
}
and I get the following error message
XMLHttpRequest cannot load http://weather.yahooapis.com/forecastrss?w=1937103. Origin http://XXXXXXXX.com is not allowed by Access-Control-Allow-Origin.
I know that I can't make the request from localhost , but I am not running a localhost
How can I solve this problem ??
I know that I can't make the request from localhost
Actually, due to the same origin policy restriction you cannot send cross domain AJAX calls. So you are not only limited to localhost. You are limited to anything different than http://weather.yahooapis.com. So unless the page containing your javascript is hosted on this domain you cannot send AJAX requests to it.
Here's a guide you might take a look at about cross domain AJAX calls. In your case you could use a server side bridge. So you will define a server side script on your domain that will fetch the remote domain results and then you could send the AJAX request to your script in order to avoid violating the same origin policy restriction.

Categories