使用OAuth2重定向登录页遇Promise报错：loginUrl需用Http

你遇到的这个问题，核心是OAuthService的安全配置和你当前使用的HTTP登录地址冲突了。错误提示“loginUrl must use Http. Also check property requireHttps”的原因很明确：

• OAuthService默认开启了requireHttps属性（值为true），这个配置是为了安全考虑，强制要求登录URL必须使用HTTPS协议；
• 但你配置的loginUrl是HTTP地址，两者不匹配就触发了未处理的Promise拒绝错误。

解决方案 #

根据你的场景（看起来是本地/内网开发环境，用的是HTTP地址），可以按以下方式修复：

1. 在OAuthService的配置代码中，添加requireHttps属性设置，将其设为false，允许使用HTTP地址：

constructor(private _router: Router, private _http: Http, private oauthService: OAuthService) { 
  this.oauthService.loginUrl = 'http://172.30.10.207:8080/uaa/oauth/authorize'; 
  this.oauthService.redirectUri = 'http://localhost:4200/'; 
  this.oauthService.clientId = 'web_app'; 
  this.oauthService.scope = 'openid'; 
  this.oauthService.setStorage(sessionStorage); 
  this.oauthService.oidc = false; 
  // 新增这一行，关闭HTTPS强制检查
  this.oauthService.requireHttps = false;
  this.oauthService.tryLogin({}); 
}

2. 如果你是在生产环境部署，强烈建议把登录URL换成HTTPS协议，同时保持requireHttps为true——这是OAuth2认证的安全最佳实践，能避免敏感认证信息在网络传输中被窃取。

额外提示 #

修改后记得重启Angular应用确保配置生效。如果还遇到其他Promise拒绝问题，可以给tryLogin添加catch处理来捕获并处理错误：

this.oauthService.tryLogin({})
  .catch(error => {
    console.error('登录检查出错:', error);
    // 这里可以添加自定义错误处理逻辑，比如跳转到错误提示页面
  });

内容的提问来源于stack exchange，提问作者Bhagyashree