I'm trying to use getAddress.io, and while the syntax is very simple, I'm trying to write my backend management that can get whitelisted domains and usage etc.
So here is my call in jQuery:
$.ajax({
url: " https://api.getAddress.io/v2/usage",
context: document.body,
method: "GET",
data: {"api-key": getAddressAPIKey}
}).done(function(results) {
$("div.usage").append(results);
});
All seems to be up to scatch. However it returns the following error:
Failed to load https://api.getaddress.io/security/ip-address-whitelist?api-key=[apikey]: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://admin.awme.local' is therefore not allowed access.
What am I doing wrong? I understand what the error is about as I've written my own APIs but this is a public API that I obviously dont have control over - and so therefore I cannot modify their code to allow me access. This is a paid for service so I should just be able to query it and get my data back. Why am I getting this error?
You need to whitelist either your domain(if you are accessing the API from client), or your server IP if using backend.
https://getaddress.io/Documentation#domain-whitelist
Just make a simple post request with you admin-key(NOT API KEY) the params(NOT IN BODY) and your domain name in the body and set Content-Type to application/json.
Here is an example request with the response using postman.
The problem is that the API has CORS set up. Try adding dataType: "jsonp" as a parameter in your AJAX request. If that doesn't work, try using something like https://cors-anywhere.herokuapp.com/
You cannot query directly from the browser, you have to query through a proxy like nginx or apache. You throw your request to the proxy and the proxy passes them to the other public API
May be the return type from the controller was not provided , This error mostly occurs when
return type is not mentioned or kept as dynamic and if the return type object contains any child elements .Just mention a proper return type.
The URL in your error message:
'https://api.getaddress.io/security/ip-address-whitelist?api-key=[apikey]'
..is not related to the code you have provided.
I assume there is more code in in your page that uses the above URL?
Did you read its document? I'm not familiar with this getAddress.io, but it seems you have to add your domain and IP to its whitelist.
Checkout Domain Whitelist and IP Address Whitelist
Related
I am trying to integrate Yammer API in my Vue.JS project, for Http calls I am using Vue-Resource plugin. While making GET Http call to get posts from Yammer it gives me following error -
Response to preflight request doesn't pass access control check: No
'Access-Control-Allow-Origin' header is present on the requested
resource.
I tried postman tool and that gives successful response, but when I try to run the same thing in my Vue.JS project using Vue-Resource plugin it wont work.
The Vue.JS code snippet -
function(){
this.$http.get("https://www.yammer.com/api/v1/messages/my_feed.json").then((data)=>{
console.log(data);
});
In main.vue file i have -
Vue.http.interceptors.push((request, next) => {
request.headers.set('Authorization', 'Bearer my_yammer_token')
request.headers.set('Accept', '*/*')
next()
})
Then I tried the code snippets provided by Postman tool for jquery, that too not working.
jQuery code -
var settings = {
"url": "https://www.yammer.com/api/v1/messages/my_feed.json",
"method": "GET",
"timeout": 0,
"headers": {
"Authorization": "Bearer my_yammer_token",
"Cookie": "yamtrak_id=some_token; _session=some_token"
},
};
$.ajax(settings).done(function (response) {
console.log(response);
});
Though, I found similar questions but nothing worked for me.
I am working this to resolve from last 2 days but getting failed again and again. Please guide/help me.
A browser has higher security requirements than a request in PostMan. In a browser, you are only allowed to make XHR requests to your own current host (combination of domain + port) but not to other remote hosts. To nevertheless make a request to a remote host, you can use the browser built-in CORS. By using this, your browser makes a pre-flight request to the remote host to ask if the current page is allowed to request from that host. This is done via the Access-Control response headers. In your case, this header is probably missing or not allowing your page to access, which is why the request does not go through. Please read further into that topic.
However, in your case, using CORS probably won't be a solution for two reasons: To use CORS, the remote host must present a header which allows every requesting host (*) or your specific one. If you cannot set that setting anywhere on the remote host, it won't work. Second, it is not safe to place your authorization token into client-side JavaScript code. Everybody can just read your JS code and extract the authorization token. For that reason, you usually make the actual API call from the server-side and then pass the data to the client. You can use your own authentication/authorization against your server and then use the static authorization key on the server to request the data from the remote host. In that case, you'll never expose the authorization key to your user. Also, on the server-side, you do not have to deal with CORS as it works just like PostMan or curl as opposed to a browser.
I am trying to access a Google Apps Script WebAPI from my website using javascript to pass some value and create an excel file and download it through this API.
I tried 2 following way:
Using POST request with $.post.
My values are many. So, at first, I use a POST request with a body is JSON of list values. Browser rejects API response, because of CORS error.
I researched about CORS to understand it. At some topics, I found a solution is the following second way.
Access to XMLHttpRequest at 'https://script.google.com/macros/s/xxxxxxx' from origin 'https://example.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Using GET request with $.getJSON.
I pass JSON of list values to URL parameter and make GET request. It worked fine.
var url = 'https://script.google.com/macros/s/' + api_id + '/exec?' + request_parameter_string;
$.post(url, payload, function(data, textStatus) {
// Do something
}, 'json');
$.getJSON(url, function(json_result) {
// Do something
})
.fail(function() {
// Do something
});
What I do not understand is why? Why it works with getJSON but not work with post?
I think CORS work with both of GET and POST requests. And I checked the response header with Postman. The headers are the same Access-Control-Allow-Origin →*.
I think have something is different inside getJSON and post functions.
*UPDATE: Update POST CORS error message.
GET requests are not bound by CORS we can host images and static files in CDN which is different from the origin and would help in improving the performance by caching and making parallel requests.
Similarly GET is used for serving ads, trackers and analytics from third party domains as well.
More information about Same Origin Policy and GET is at https://security.stackexchange.com/a/16221/9517
How the browsers identify Other HTTP Verbs are allowed for the cross origin request is elaborated # https://developer.mozilla.org/en-US/docs/Glossary/Preflight_request
I am trying to use jQuery XHR to send a simple GET request to an API at Zillow. I can see in my browser, and in Postman, that the request returns correctly. I've censored my API key below -- but the request could not be simpler.
$.ajax({
url: 'http://www.zillow.com/webservice/GetMonthlyPayments.htm?zws-id=<APIKEY_GOES_HERE>&zip=89509&output=json&price=300000&down=25',
success: function(data){alert('done');},
dataType: 'json'
});
I can see in the console that it comes back with the standard Cross-Domain error, via localhost or when on the server.
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '<MY-DOMAIN>' is therefore not allowed access.
I've used many APIs this way and I don't understand -- is it really that stupid? They expose an API but don't allow CORS? That just doesn't make any sense to me and I figure I must be missing something obvious.
Do I have to preflight due to some obscure condition on their end?
If they really don't allow CORS, can anyone help me understand the purpose of this endpoint?
The API is documented very nicely here .
Thanks Stack. Appreciate your help.
Edit: If you'd like to see what I'm seeing, you can get an API key with no sweat.
It looks like they have forbidden CORS. What you need to do is set up your own server that hits Zillow's endpoint, and use AJAX to hit that route on your own server. I believe the purpose of this is to suppress CSRF, so the user's cookies will not be sent to Zillow since it is going through your server instead of going directly to Zillow from the browser.
I have already published a app script, and I test the query string in the browser, and it works well. I would like to send a xmlhttprequest to the script, but it shows =>
XMLHttpRequest cannot load https://script.google.com/macros /s/XXXXXXXXXX/exec. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://docs.google.com' is therefore not allowed access.
This is the app script code:
function doGet(e){
Logger.log(e.parameter.id);
//other function
return ContentService.createTextOutput("Hello World");
}
Here is the client code:
$.ajax({
url:'https://script.google.com/macros/s/XXXXXXXX/exec',
method:'POST',
data:{
id: "123123"
},
success:function(){
console.log("success");
}
});
There are a few possibilites, and I have ran into this error before myself. As I have insufficient reputation to comment and ask for clarification, I will write the most probable cause.
This problem has 2 parts - You can't post (unstringified) objects, and errors on google apps script do not have CORS headers
solution: stringify and parse the object
Without converting the object to a string, your browser will just send [Object object] and not the information.
This will cause an error on your script, and error messages by Google Script are HTML webpages that don't have CORS headers, which triggers the CORS error that does not really tell you the true problem
To be able to successfully POST the parameters, you have to convert the object to a string (e.g. by using JSON.stringify()), get the value through e.postData.contents on your google apps script, parse it, before you can use it as if it were an object.
I personally found when I read that I can't send raw objects in javascript - pass object via post
You mentioned that the code worked when you tested it using the query string in your browser, however, it is different as that will be a GET request and will trigger doGet instead of doPost
this is the most probable explanation and hope it helps!
Do test your code with default values before deploying it as once you deploy your code it can get very troublesome. You can use https://hurl.it to see what actually comes out without cors errors in the way.
I am trying to create wallet on Blockchain using Ajax but I am getting "Cross-Origin Request Blocked" error. My Ajax call is:
$.ajax({
type: 'POST',
url: 'https://blockchain.info/api/v2/create_wallet',
data: "cors=true&email="+email+"&password="+password+"&api_code="+code,
dataType:'json',
crossDomain: true,
beforeSend:function(){
},
success: function (data) {
}
});
When I post this I get error Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://blockchain.info/api/v2/create_wallet. This can be fixed by moving the resource to the same domain or enabling CORS.
On Blockchain they say that Some API calls are available with CORS headers if you add a cors=true parameter to the request
I have tried everything, I have tried to send this parameter as a GET as well as POST parameter, I have tried jsonp. I have also tried with the header Access-Control-Allow-Origin * but nothing seems to be working. Can anyone confirm if he managed to create blockchain wallet using Ajax call or they don't support CORS for this. Any help will be much appreciated.
Thanks
Hamza
I think it is safe to say that blockchain does not support CORS for their wallet API.
Your AJAX call above looks correct and you are getting a CORS blocked error.
And unlike some of their other APIs, the blockchain wallet API docs at https://blockchain.info/api/blockchain_wallet_api do not specify that calls are available via CORS with the cors=true query parameter.
There are some significant security implications when dealing with private keys and passwords in the browser using javascript. I suspect that is why they do not allow it.
The solution for this is insanely simple. Just do that request on the server side and then call your server script which does that request from your $.ajax() method.