Cross-Origin Request Blocked

[Hory]

Hi!

When i am trying pass api function using ajax, browser gives me an error message. It may be a noob question, but i have no idea what to do with it.

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://127.0.0.1:8888/api?method=get_folders. This can be fixed by moving the resource to the same domain or enabling CORS.

[delegatevoid]

Hi,

 

Normally when you create an XMLHTTP request you can only do so to request a resource

on the same domain/port as the one the website is hosted on.

 

For example, your domain is example.com and you host a website on the subdomain www.example.com

Now the JavaScript of the pages on that site can only create requests to resources on the same subdomain

 

Consider this:

$.ajax({  url: "test.html",})

This is allowed, as it will request http://www.example.com/test.html

The following is the same:

$.ajax({  url: "http://www.example.com/test.html",})

The last example however is not:

$.ajax({  url: "http://example.com/test.html",})

As you are sending a request to a different domain (or subdomain) than the one

where the request originated from (www.example.com)

 

This is called a cross-domain request and is not allowed for security reasons.

 

Now let's say your website is hosted by a web server on your local machine,

then you'd access it through:

 

http://127.0.0.1:80   (you do not really type the port, but it's important to see the difference here)

 

Then your JavaScript is making a request to http://127.0.0.1:8080

Which is the same computer but on a different port (different web server, yours vs the built-in one of btsync)

so it's considered a cross domain request and blocked.

 

There are ways to work around this but your mileage may vary.

 

Here are some resources:

 

More information on the same-origin domain policy: https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy

W3C Recommendation: http://enable-cors.org/  and http://www.w3.org/TR/cors/

 

The HTML5 example might get you started.

[misantronic]

I am facing the same issue. Is there no way to actually set the headers for btsync to enable cross-domain-requests?

I'm trying to access the API on my localhost:8888 via angular.js

XMLHttpRequest cannot load http://localhost:8888/api/v2/folders.'>http://localhost:8888/api/v2/folders. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access. The response had HTTP status code 401.

EDIT:

 

So I just added mod_proxy to my apache webserver and added a new site:

<VirtualHost *:80>   ProxyPreserveHost On  #ProxyRequests Off  ServerName btsync.localhost  #ServerAlias btsync.localhost  ProxyPass / http://localhost:8888/  ProxyPassReverse / http://localhost:8888/  Header set Access-Control-Allow-Origin "*"</VirtualHost> 

I set the Access-Control-Allow-Origin to * in this so I can acually access btsync.localhost from anywhere. This works.

Another problem that I have is, that I cannot send the Basic Auth credentials via the Ajax-Request. They're alway rejected. I do something like this:

$http.defaults.headers.common.Authorization = 'Basic '+ btoa('user:password');$http.get('http://btsync.localhost/api/v2/folders')

He actually adds the users credentials to the header but I still get an error:

XMLHttpRequest cannot load http://btsync.localhost/api/v2/folders. Invalid HTTP status code 401

Edited July 28, 2015 by misantronic