Facebook Oauth2独立服务和客户端:因此不允许访问“null”

时间:2017-07-27 10:58:32

标签: javascript ajax spring facebook facebook-javascript-sdk

我正在尝试通过AJAX调用在http://localhost:8099/login/facebook使用服务,但我收到错误说

XMLHttpRequest cannot load https://www.facebook.com/dialog/oauth?client_id=&redirect_uri=http://localhost:8099/login/facebook&response_type=code&state=m1Sz3P. Redirect from 'https://www.facebook.com/dialog/oauth?client_id=&redirect_uri=http://localhost:8099/login/facebook&response_type=code&state=m1Sz3P' to 'https://www.facebook.com/login.php?skip_api_login=1&api_key=…_&display=page&locale=en_GB&logger_id=0b9ffa85-8845-5-315dce43566e' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

以下是我的客户端代码

<!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>

当我尝试直接从浏览器点击网址http://localhost:8099/login/facebook时,我正在重定向到所需的网页。但不是通过AJAX调用
下面是我在服务中添加的CORS Filter类

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 {
    }
}

如何解决这个问题? 我试图点击的API是REST API,它运行在不同的端口。感谢..

0 个答案:

没有答案