I'm writing a simple Flask api that will serve data to a d3.js frontend and I am getting this error when I try to query for the data:
XMLHttpRequest cannot load localhost:5000/data/sample_data. Cross origin requests are only supported for protocol schemes: http, data, chrome-extension, https, chrome-extension-resource.
I am using the flask-cors extension for flask, even though I am querying from my own domain (localhost) so I thought that this shouldn't even count as "Cross-domain". Can anyone shed some light on why this isn't working?
URLs should have a valid schema for CORS to kick in. While Chrome's address bar can prefix the schema for URLs, most AJAX libraries (jQuery, d3, etc.) do not smartly do it before making the request.
Appending http:// to the URL(s) should fix the problem.
Related
I'm getting the error:
Mixed Content: The page at 'https://mywebsite.io/content_library' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://mywebsite.io/api/blog_posts/'. This request has been blocked; the content must be served over HTTPS.
In my axios request, I'm simply using relative urls, '/api/blog_posts/` so why isn't axios sending the requests with https instead of http?
I had the same error, my site is served with haproxy over https and the nginx server just runs http
I don't think its axios related but a general problem for XmlHttpRequest?
However, i've set: Content-Security-Policy to upgrade-insecure-requests, which fixes this problem at least on chrome. But I think microsoft edge does not support this.
So, the better fix should be to use an absoluteURL in axios with https.
I still don't get, why axios/browser is using http here...
Am working in Mobile App develoment using HTML5 + Phonegap. Currently am working a mobile App using XMLRPC and its working fine. (Android and iOS)
I need to work the same application as a website in browsers. (using HTML5).
But when am trying to Run my application on website i am getting this error :
XMLHttpRequest cannot load 'Client' URL'. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost <http://localhost/>' is therefore not allowed access.
When am search experts says that use JSONP. But using same XMLRPC method can i work it ?
For example ;
For a Login purposes am using ;
$.xmlrpc({
url: 'http://clienturl/xmlrpc/common',
methodName: 'login',
params: [Database_name','user_name','Password'],
success: function(response, status, jqXHR) {
alert('success'); },
error: OnError
});
Its working fine as a Mobile Application.
But gets Access-Control-Allow-Origin cross domain issue when i am trying to run as a Website.
How can i fix this ?
By default the SOP (same origin policy) allows cross-origin requests, but it prevents receiving the responses of those requests. The Access-Control-Allow-Origin in your error message is a CORS (cross-origin resource sharing) header. It tells the browser that you allow reading the responses of a domain (your XMLRPC server's domain) by sending requests from another domain (your XMLRPC client's domain). So you have to send back CORS allow headers from your server if you want to call it with AJAX.
note: CORS won't work in old browsers.
Possible solutions:
If you call http://clienturl/xmlrpc/common from http://localhost then the
response.header('Access-Control-Allow-Origin', "*")
is one not so secure solution according to this: Origin http://localhost is not allowed by Access-Control-Allow-Origin
But you can always add another hostname (e.g. http://client.xml.rpc) for your client, for example by windows you can modify the hosts file and add a binding using the IIS server.
I don't recommend this solution, because it is a security risk with the allow credentials header.
Another more secure options is to make a list of allowed hosts, check from which host you got the actual request, and send back the proper header:
if (allowedHosts.contains(request.host))
if (request.host== "http://localhost")
response.header('Access-Control-Allow-Origin', "null");
else
response.header('Access-Control-Allow-Origin', request.host);
else
response.header('Access-Control-Allow-Origin', server.host);
This is the proper solution with multiple hosts, because if you allow credentials for *, then everybody will be able to read and write the session of a logged in user.
By http://localhost and file:/// IRIs you have to use the null origin. I am unsure about other protocols, I guess in the current browsers you have to use null origin by them as well.
I'm getting this error when trying to make an ajax request in a custom module:
XMLHttpRequest cannot load https://www.vossmarket.com/index.php/shoppinglist/index/showLists/product/4294/form_key/6erZKqom1ynOWDKI/qty/1/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.vossmarket.com' is therefore not allowed access.
I'm assuming the problem is that I am calling https from the http, but I'm not able to figure out why it is calling the https. I've turned off https in the magento config (I changed secure_base_url to http://vossmarket.com and I turned Use Secure URLs in Frontend to "no"). Now all links stay http, but when I visit my custom module, it is still redirecting (302) to https. This happens to every link http://vossmarket.com/shoppinglist (my custom module), any other route stays http, but any route that hits my module in any ways 302s to https
Any ideas what might be happening or the best way to fix it?
Have you tried putting a file called crossdomain.xml in your web root (accessible by both http and https), ie at http(s)://vossmarket.com/crossdomain.xml
This should help define that cross site origin is allowed between http and https.
In your case, I think the custom module is upset about being accessed over http and is sending the 302 to your browser, so it would be a case of studying the controller action of the custom module to figure out why it is forcing https (instead of asking Magento what the secure URL is).
Actually, if you try this crossdomain.xml you will need the browser to request https out of the http loaded page otherwise I think you will still get the 302 redirect - but with crossdomain.xml in place you should be able to XMLHttpRequest from http://vossmarket.com to https://vossmarket.com
But, you know, often there is good reason for https so I think you should understand why https is being forced and also I don't know about that XML secure="false" - does it really mean an https request is returned over http? I hope not but I don't know.
For more information read up on CORS although your 'cross domain' is http crossing to https.
I've a server named, foo.com where my application is running and accessing a service available on a different domain bar.foo.com.
With the simple XHR request to bar.foo.com/getUsers, I'm getting an error saying, No 'Access-Control-Allow-Origin' header is present. I do not want to use JSONP as a fallback to cross-domain issue.
Is there any easy fix I can do on server level to enable cross subdomain requests while XHRing?
It appears that I need to set allow-cross-domain headers on server when a response is returned as suggested by #Blender above.
Or I can use xdomain library which uses PostMessage API to enable cors. With this I can even read iframe's content served by different domain.
I am trying to implement OAUTH for accessing Flickr APIs. My AJAX call to flickr.com keeps failing.
Sample Error Message:
XMLHttpRequest cannot load http://www.flickr.com/services/oauth /request_token?oauth_callback=oob&oauth…signature_method=HMAC-SHA1&oauth_timestamp=1368375405647&oauth_version=1.0. Origin http://localhost:8080 is not allowed by Access-Control-Allow-Origin.
Initially I used chrome and read the html file as file://path. I used to get the error 'null not allowed by access-control-allow-origin'. I solved this problem by copying the html file to 'local IIS server', 'local python webserver' and then a 'remote webserver'. I created python web server using > python -m http.server 8080'
I realize my cross browser call to flickr.com using XMLHttpRequest is failing. I tried by various solutions suggested in this forum:
Using newer Chrome 26.0.1410.64 m, which I guess supports CORS
I launched chrome with --disable-web-security
I created a web server using python -m http.server 8080 on local machine and then on a remote machine and copied the html file to the site
I copied file to a local MSFT IIS server
I defined URL in etc/hosts file to avoid numeric IP
I still get the same error (with relevant URL in the error message)
code clipping:
urlString="http://www.flickr.com/services/oauth/request_token?"+
"oauth_callback="+"oob"+'&'+
"oauth_consumer_key="+consumerKey+'&'+
"oauth_nonce="+nonce+'&'+
"oauth_signature="+esignature+'&'+
"oauth_signature_method="+macAlgorithm+'&'+
"oauth_timestamp="+timeStamp+'&'+
"oauth_version=1.0";
$.ajax({
url: urlString,
success:function(data){
alert(data);
}
});
In order to CORS work, both ends must enable it.
The first end is the browser, and, as you are using Chrome 26.*, yours is ok.
The second end is the server:
Before making a GET request to a domain different than the one the page is on, the browser sends an OPTIONS request to that domain. In response to this request, the server should include some headers that tell if a cross-domain request (GET, POST or other) is allowed.
One of those headers is Access-Control-Allow-Origin.
So when you run your page from your file system (file:// "protocol"), the OPTIONS means something like "Flickr, can I make a cross-domain call to you? I'm calling from null". Flickr does not recognize that domain as allowed and returns the error you are getting.
Same way, when you run your page from your local server, the OPTIONS says "(...) I'm calling from localhost:8080". Flickr does not recognize that domain as allowed as well.
The solution:
I don't know the Flickr oauth service, but I know that, as any other service, to make a CORS call to it, the page must be in a domain allowed by it. From your tests, I'm guessing Flickr does't allow many other domains.
But... an alternative to CORS is JSONP. I did a little research, Flickr oauth seems to support it.
Check this page for details: http://www.flickr.com/services/api/explore/flickr.auth.oauth.getAccessToken
There's another question talking about that specific subject:
Is JSONP supported in the new Flickr OAuth API?
About JSONP, this can get you started: How to make a JSONP request from Javascript without JQuery?
It is not possible to implement Oauth 1.0 through just javascript without any server side script. Since the flickr's new authentication process is based on Oauth 1.0a. You got to use a server-side script.
I tried to send the token request using JSONP in FireFox with CORS on(using a third-party add-on) and it worked fine. But without using any add-ons, it's not possible as the response from flickr is in text format(not in a JSON format) and the request fails.
You can either use server-side code for token request. OR Use the deprecated flickr API for authentication.