Cross browser No 'Access-Control-Allow-Origin' - cross-browser

Trying to get add from mobicow.On loading this URL got an xml response .But from my website
shows this error...
XMLHttpRequest cannot load http://cdn.mobicow.com/feed/get/pub/4792/sub/{id}/ip/184.72.184.19/ua/Mozil…537.36/ref/http%3A%2F%2Fwww.comikka.com%2F/lang/en-US/kw/0/c/2/compliant/0. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.
my code
var url='http://cdn.mobicow.com/feed/get/pub/4792/sub/3352/ip/184.72.184.19/ua/Mozilla%2F5.0%20(Windows%20NT%206.1%3B%20WOW64)%20AppleWebKit%2F537.36%20(KHTML%2C%20like%20Gecko)%20Chrome%2F36.0.1985.143%20Safari%2F537.36/ref/http%3A%2F%2Fwww.comikka.com%2F/lang/en-US/kw/0/c/2/compliant/0'
$.get(url, function( data ) {
alert( 'Successful cross-domain AJAX request.' );
});

This is a common problem when you are using AJAX.
If you page is loaded by going to
http://www.domain1.com/samplefirstpage.php
And you ajax wants to load something from
http://www.antherdoomain.com/anotherpage.php
You will get this error
If you keep that in mind, you should be able to hunt down the reason why your code is giving you this error
Cheers

Related

read data from a json file using Angular http get

constructor(private http:HttpClient){
this.http.get('http://localhost:81/{path}/loginResult.json/data')
.subscribe(result => this.data = result);
console.log(this.data);
}
my loginResult.json
{"data":"logged successully"}
I try to get corresponding value of data , but I got errors, how to do it correctly
Access to XMLHttpRequest at 'http://localhost:81/{path}/loginResult.json' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource
You might want to use the dev server for Angular to proxy your requests while you are developing your application. Doing so will allow you to send requests without CORS errors while you are in the development phase. Here is the documentation:
https://angular.io/guide/build#proxying-to-a-backend-server

Is there a way to "GET" a csv like information in a website using only Vue.js?

I'm trying to "get" the information in this website: http://nestlegremio.ddns.net:8003/local/people-counter/.api?export-csv&date=20181126&res=30m using only vue.js http
this.$http.get('http://nestlegremio.ddns.net:8003/local/people-counter/.api?export-csv&date=20181126&res=30m').then(response => {
if (response.body.length === 0) {
console.log('error')
} else {
console.log(response.body)
}
})
but I'm getting the console error:
Access to XMLHttpRequest at 'http://nestlegremio.ddns.net:8003/local/people-counter/.api?export-csv&date=20181126&res=30m' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Is there another way to do this?
The error you are facing here comes from the fact the the server your are trying to get the file from does not allow CORS (Cross-Origin Resource Sharing).
Putting is simply, you site (e.g. running on http://localhost:3003/) is trying to access http://nestlegremio.ddns.net:8003/.
When a web browser tries to access a resource that doesn't reside on
the same domain (http://localhost:3003/), it does a first query to
the web server with OPTIONS to get CORS info from the server.
If the server does not say CORS is enabled for this domain, then the
browser won't run the request and throw the error message you saw.
The solution here is:
If you have access to this given we server, is to allow CORS on it, if you want to rely only on client-side code.
If you don't have access to the server, you will have to build some server code to retrieve your data from the given url, then to give it back to your Vue.js code. Http calls done from server-side code are not impacted by CORS.
Here is a more detailed explanation on this topic.

Cross-domain $http request AngularJS

I have simple website I'm building with AngularJS which calls an API for json data.
However I am getting Cross domain origin problem is there anyway around this to allow for cross domain requests?
Error:
XMLHttpRequest cannot load http://api.nestoria.co.uk/api?country=uk&pretty=1&action=search_listings&place_name=soho&encoding=json&listing_type=rent. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http:// localhost' is therefore not allowed access.
searchByPlaceName: function() {
var url = baseurl+'country=uk&pretty=1&action=search_listings&place_name=london'+encoding+type;
return $http.get(url);
}
It seems that api.nestoria.co.uk does not allow CORS. It has to set the Access-Control-Allow-Origin header itself -- you have no direct control over that.
However, you can use JSONP. That site allows it via the callback query parameter.
$http.jsonp(baseurl+'country=uk&pretty=1&action=search_listings&place_name=london'
+encoding+type + "&callback=JSON_CALLBACK")
Install Fiddler. Add a custom rule to it:
static function OnBeforeResponse(oSession: Session)
{
oSession.oResponse.headers.Add("Access-Control-Allow-Origin", "*");
}
This would allow you to make cross domain requests from localhost. If the API is HTTPS make sure you enable 'decrypt HTTPS traffic' in fiddler.
Reference
-------------------- UPDATE
The response you are getting is JSON. Specifying JSONP as datatype would not work. When you do specify JSONP the return should be a function not JSON object.
JSONP

Not able to fetch the json response through angularjs

Need to fetch the build values from apache.org. So i am using their api
https://builds.apache.org/api/json
I tried angularjs $http.jsonp but not able to fetch the data.
In chrome console under network json api is getting loaded but the data is not getting returned instead it is throwing the response as error.
app.controller("jsoncontroller",function($scope,$http){
var url='https://builds.apache.org/api/json';
$http.jsonp(url).success(function(data){
console.log('success');
})
.error(function () {
console.log('error')
});
});
Getting the error as
Uncaught SyntaxError: Unexpected token :
error
As per the jsonp angular docs, you must append JSON_CALLBACK to the URL: https://builds.apache.org/api/json?jsonp=JSON_CALLBACK
However, that URL doesn't work because even when the callback parameter is specified, the server still sends back a content-type of application/json, instead of the expected application/javascript. This causes it to be parsed (evidently) by the json parser instead of the javascript callback needed for JSONP to work. I'm not versed enough in JSONP or Angular to know who is it fault here.
I've made a fiddle with this working with another URL.
[Update]: The apache build server appears to use Jenkins, which has disable JSONP from the remote API. You can verify this yourself by trying to hit their jsonp endpoint, which returns a 403. You'll have to use another endpoint, no way I can see around this.

JSONP cross-domain request error

Is there a way to get response status when doing JSONP request. I mean, can I see if it was a successful request 200 OK, or not found 404, or not available, etc. ?
ALTERNATIVELY: Maybe there is a way to try to load .js file using new Image() object, i.e. assuming it is an image and then see the response status? Or try to load even something completely different?
Is there any JavaScript cross-domain way to check if a resource is available or 404 unavailable?
May be that library can be helpful:
https://github.com/jaubourg/jquery-jsonp