【问题标题】:getting 401 to access http://localhost:8080/oauth/token获取 401 访问 http://localhost:8080/oauth/token
【发布时间】:2015-09-06 21:55:49
【问题描述】:

当我这样做时,我从我的 angularjs 客户端应用程序到达一个端点以登录,我在浏览器控制台中收到以下错误

选项http://localhost:8080/oauth/token XMLHttpRequest 无法加载 http://localhost:8080/oauth/token。 HTTP 状态码 401 无效

从客户端接受 CORS 是服务器端代码。

@Component
public class SimpleCORSFilter implements Filter {

	public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
		HttpServletResponse response = (HttpServletResponse) res;
		response.setHeader("Access-Control-Allow-Origin", "*");
		response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
		response.setHeader("Access-Control-Max-Age", "3600");
		response.setHeader("Access-Control-Allow-Headers", "x-requested-with");
		chain.doFilter(req, res);
	}

	public void init(FilterConfig filterConfig) {}

	public void destroy() {}

}

这是调用http://localhost:8080/oauth/token的客户端代码

angular.module('frontendApp')
  .factory('AuthServerProvider', function loginService($http, localStorageService, Base64, API_SERVER) {
    return {
      login: function (credentials) {
        var data = "username=" + credentials.username + "&password="
          + credentials.password + "&grant_type=password&scope=read%20write&" +
          "client_secret=123456&client_id=clientapp";
        return $http.post(API_SERVER + 'oauth/token', data, {
          headers: {
            "Content-Type": "application/x-www-form-urlencoded",
            "Accept": "application/json",
            "Access-Control-Allow-Origin": "*",
            "Authorization": "Basic " + Base64.encode("clientapp" + ':' + "123456")
          }
        }).success(function (response) {
          var expiredAt = new Date();
          expiredAt.setSeconds(expiredAt.getSeconds() + response.expires_in);
          response.expires_at = expiredAt.getTime();
          localStorageService.set('token', response);
          return response;
        });
      },
      logout: function () {
        // logout from the server
        $http.post('api/logout').then(function () {
          localStorageService.clearAll();
        });
      },
      getToken: function () {
        return localStorageService.get('token');
      },
      hasValidToken: function () {
        var token = this.getToken();
        return token && token.expires_at && token.expires_at > new Date().getTime();
      }
    };
  });

【问题讨论】:

  • 你在 Spring 中将 url oauth/auth 添加到匿名权限?
  • 将“授权”标头添加到 Access-Control-Allow-Headers 列表
  • @Michael 我已经在代码中添加了这些 Access-Control-Allow-Headers 列表 请查看一次,当我在浏览器控制台中看到时,我的凭据没有添加到请求中网络。
  • OPTION 请求是从浏览器发送来检查访问权限的 - 而不是来自 Angular。不确定解决方案,但你应该在谷歌上搜索CORS with credentials

标签: java javascript angularjs oauth spring-boot


【解决方案1】:

如果是 OPTIONS 请求,你不应该做进一步的处理,即跳过对chain.doFilter(req, res)的调用,例如:

    HttpServletRequest request = (HttpServletRequest) req;
    HttpServletResponse response = (HttpServletResponse) resp;

    response.addHeader("Access-Control-Allow-Origin", "*");

    if ("OPTIONS".equalsIgnoreCase(request.getMethod())) {
        response.setHeader("Access-Control-Allow-Methods", "POST,GET,DELETE");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Headers", "content-type,access-control-request-headers,access-control-request-method,accept,origin,authorization,x-requested-with");
        response.setStatus(HttpServletResponse.SC_OK);
    } else {
        chain.doFilter(req, resp);
    }

【讨论】:

  • 我添加了您的代码,但应用程序仍然无法运行我在浏览器控制台中收到以下错误“XMLHttpRequest cannot load localhost:8080/oauth/token. Request header field Access-Control-Allow-Origin is not allowed通过访问控制允许标题"
  • 客户端不应该发送“Access-Control-Allow-Origin”头,它是由服务器发送给客户端的!从你的 JS 代码中删除它。
猜你喜欢
  • 2018-12-31
  • 2021-01-20
  • 2020-08-08
  • 2021-07-03
  • 1970-01-01
  • 2019-03-19
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多