angular - 如何从 angular localhost:4200 调用 spring security azure AD localhost:8080。天蓝色调用中的错误
问题描述
包 com.example.demo;
import java.util.Arrays;
import java.util.Collections;
import org.springframework.beans.factory.annotation.Configurable;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.security.config.annotation.method.configuration.EnableGlobalMethodSecurity;
import org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity;
import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter;
import org.springframework.security.config.http.SessionCreationPolicy;
import org.springframework.security.oauth2.client.oidc.userinfo.OidcUserRequest;
import org.springframework.security.oauth2.client.userinfo.OAuth2UserService;
import org.springframework.security.oauth2.core.oidc.user.OidcUser;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.CorsConfigurationSource;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
@Configuration
@EnableWebSecurity
@EnableGlobalMethodSecurity(prePostEnabled = true)
public class SecurityConfiguration extends WebSecurityConfigurerAdapter {
private final OAuth2UserService<OidcUserRequest, OidcUser> oidcUserService;
public SecurityConfiguration(OAuth2UserService<OidcUserRequest, OidcUser> oidcUserService) {
System.out.println("loading user:" + oidcUserService);
this.oidcUserService = oidcUserService;
}
@Override
protected void configure(HttpSecurity http) throws Exception {
http.cors()
.and().authorizeRequests()
.anyRequest()
.authenticated()
.and()
.oauth2Login()
.userInfoEndpoint().oidcUserService(oidcUserService);
}
@Bean
CorsConfigurationSource corsConfigurationSource()
{
CorsConfiguration configuration = new CorsConfiguration();
configuration.setAllowedOrigins(Arrays.asList("*"));
configuration.setAllowedMethods(Arrays.asList("*"));
configuration.setAllowedHeaders(Arrays.asList("*"));
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", configuration);
return source;
}
接口:
package com.example.demo;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
public class AccountResource {
@Autowired
AdUserInfo adUserInfo;
@CrossOrigin(origins = "http://localhost:4200")
@GetMapping("/account")
public AdInfo getAccount() {
adUserInfo.setEmail("abc@gmail.com");
return new AdInfo();
}
}
角代码:
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable, Subject } from 'rxjs';
import { AdInfo } from './ad-info';
@Injectable({
providedIn: 'root'
})
export class LoginService {
private loginUrl: string;
constructor(private http: HttpClient) {
this.loginUrl = 'http://localhost:8080/account';
}
public login(): Observable<AdInfo> {
return this.http.get<AdInfo>(this.loginUrl);
}
}
角类:
export class AdInfo {
id: string;
name: string;
email: string;
}
从 http://localhost:8080 调用工作正常。它转到 azure 和 login 。根据 • https://docs.microsoft.com/en-us/azure/developer/java/spring-framework/configure-spring-boot-starter-java-app-with-azure-active-directory。
现在我想从 Angular UI 调用它。所以本地主机:4200。做了一个登录页面。Onlick 登录按钮。它正在调用 localhost:8080。但显示重定向到 azure 广告登录时出错。
错误:在 'https://login.microsoftonline.com/common/oauth2/authorize?response_type=code&client_id=******&scope=openid%20https://graph.microsoft.com/user.read&state 访问 XMLHttpRequest =a04QyhpKFkvGUvjUCRwZ834QhTgzTFYIu74M0768Co0%3D&redirect_uri=http://localhost:8080/login/oauth2/code/azure'(重定向自'http://localhost:8080/account')来自源'http://localhost:4200'已被阻止通过 CORS 策略:请求的资源上不存在“Access-Control-Allow-Origin”标头
在 'https://login.microsoftonline.com/common/oauth2/authorize?response_type=code&client_id=******&scope=openid%20https://graph.microsoft.com/user.read&state=Du8JvHSEGdD3xcBft6B683mDrW8Zedppel1Xz6lBZwY 访问 XMLHttpRequest来自源“http://localhost:4200”的 %3D&redirect_uri=http://localhost:4200/login/oauth2/code/azure'(从“http://localhost:4200/account”重定向)已被 CORS 阻止策略:对预检请求的响应未通过访问控制检查:请求的资源上不存在“Access-Control-Allow-Origin”标头。
解决方案
您可能面临的问题是 Spring Security 不会让飞行前检查请求通过并使其失败。
添加
configuration.setAllowedHeaders(Arrays.asList("Origin", "Content-Type", "Accept","Authorization"));
configuration.setAllowedMethods(Arrays.asList("GET","POST"));
并在 Angular 中尝试将代理添加到后端服务器
推荐阅读
- kubernetes - Kubernetes 上的 Hyperledger Fabric - Restarting Peer throw 错误几分钟
- cordova - Cordova IOS/Android 屏幕显示,带有凹口和软菜单
- django - 关闭 RabbitMQ 会使 Django 冻结
- flutter - 如何在flutter web中做一个可拖动的定位销选择器
- oracle - Oracle Apex 修改会话超时消息
- android - 为什么 Android Realm 与 MongoDb 同步时不返回任何结果?
- join - Pyspark 使用 sql join 连接多个数据帧
- c# - 参数嗅探问题 SQL Server
- python - 当您已经直接导入模块时,是否有使用完整方式模块的意义?
- stream - 使用 MediaSource 缓冲区附加 WebRTC 流