Javascript FacebookOAuth2独立服务和客户端：Origin'；空'；因此不允许访问_Javascript_Ajax_Spring_Facebook_Facebook Javascript Sdk

Javascript FacebookOAuth2独立服务和客户端：Origin'；空'；因此不允许访问

javascript ajax spring facebook

Javascript FacebookOAuth2独立服务和客户端：Origin'；空'；因此不允许访问,javascript,ajax,spring,facebook,facebook-javascript-sdk,Javascript,Ajax,Spring,Facebook,Facebook Javascript Sdk,我试图通过AJAX调用使用处的服务，但我收到一个错误消息说XMLHttpRequest无法加载https://www.facebook.com/dialog/oauth?client_id=&redirect_uri=http://localhost:8099/login/facebook&response_type=code&state=m1Sz3P. 重定向自'https://www.facebook.com/dialog/oauth?client_id=&redirect_uri=http

我试图通过AJAX调用使用处的服务，但我收到一个错误消息说

XMLHttpRequest无法加载https://www.facebook.com/dialog/oauth?client_id=&redirect_uri=http://localhost:8099/login/facebook&response_type=code&state=m1Sz3P. 重定向自'https://www.facebook.com/dialog/oauth?client_id=&redirect_uri=http://localhost:8099/login/facebook&response_type=code&state=m1Sz3P“到”https://www.facebook.com/login.php?skip_api_login=1&api_key=…CORS策略已阻止“\uU&display=page&locale=en\u GB&logger\u id=0b9ffa85-8845-5-315dce43566e”：无“访问控制允许源站”请求的资源上存在标头。因此，不允许访问源站“null”。

下面是我的客户代码

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
Hello world
<button type="submit">FaceBook</button>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $.ajax({
            crossDomain: true,
            withCredentials: true,
            url: "http://localhost:8099/login/facebook",
            success: function(result){
                 alert("success");
        },
        error: function (xhr, status) {
            alert("error");
        }
        });
    });
});

</script>
</body>
</html>

如何解决这个问题？

我试图点击的API是在不同端口运行的REST API。谢谢..

您不能通过AJAX在后台加载Facebook登录对话框-原因很明显，用户需要能够通过地址栏验证他们确实在向Facebook发送凭据，而不是某些钓鱼网站。

import java.io.IOException;

import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.core.Ordered;
import org.springframework.core.annotation.Order;
import org.springframework.stereotype.Component;

@Component
@Order(Ordered.HIGHEST_PRECEDENCE)
public class CorsFilter implements Filter {

    @Override
    public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
        final HttpServletResponse response = (HttpServletResponse) res;
        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setHeader("Access-Control-Allow-Methods", "POST, PUT, GET, OPTIONS, DELETE");
        response.setHeader("Access-Control-Allow-Headers", "Authorization, Content-Type");
        response.setHeader("Access-Control-Max-Age", "3600");
        if ("OPTIONS".equalsIgnoreCase(((HttpServletRequest) req).getMethod())) {
            response.setStatus(HttpServletResponse.SC_OK);
        } else {
            chain.doFilter(req, res);
        }
    }

    @Override
    public void destroy() {
    }

    @Override
    public void init(FilterConfig config) throws ServletException {
    }
}