原点“http://localhost:4200”已被带有角度和弹簧启动的 CORS 策略阻止

Question

我正在尝试使用 angular 和 spring 做简单的 CRUD。我在我的 Spring Boot 应用程序中实现了 JWT 身份验证。之后，每当我执行插入操作时，它都可以正常工作，但是每当我尝试编辑和删除它时，都会给出“origin 'http://localhost:4200' has been blocked by CORS policy'错误。为什么我收到此错误我在安全配置中添加了“CorsFilter”bean，但它仍然给我同样的错误。 在添加 JWT 身份验证之前，所有 CRUD 操作都运行良好。

请告诉我为什么会出现此错误。

SecurityConfig.java

@Configuration
@EnableWebSecurity
@EnableGlobalMethodSecurity(prePostEnabled = true)
public class SecurityConfig extends WebSecurityConfigurerAdapter {
    @Override
    protected void configure(HttpSecurity http) throws Exception { 
            http.
            cors().configurationSource(request -> new CorsConfiguration().applyPermitDefaultValues())
        .and().csrf().disable()
                .authorizeRequests()                                                                
                .antMatchers("/**").permitAll()                  
                .antMatchers("/").hasRole("ADMIN")                                      
                .antMatchers("/*").hasRole("USER")
                .and()
                .exceptionHandling()
                .accessDeniedPage("/access-denied")
                .and()
                .addFilter(new JWTAuthenticationFilter(authenticationManager()))
                .addFilter(new JWTAuthorizationFilter(authenticationManager(), customUserDetailService));
    }
      
    @Bean   
    public CorsConfigurationSource corsConfigurationSource() {
        CorsConfiguration configuration = new CorsConfiguration();
        configuration.setAllowedOrigins(Arrays.asList("http://localhost:4200"));
        configuration.setAllowCredentials(true);
        configuration.setAllowedMethods(Arrays.asList("GET", "POST", "PUT", "PATCH", "DELETE", "OPTIONS"));
        configuration.setAllowedHeaders(Arrays.asList("Authorization", "Cache-Control", "Content-Type", "xsrfheadername","xsrfcookiename"
        ,"X-Requested-With","XSRF-TOKEN","Accept", "x-xsrf-token","withcredentials","x-csrftoken"));
        configuration.setExposedHeaders(Arrays.asList("custom-header1", "custom-header2"));
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", configuration); 
        return source; 
    }

}

控制器

@RestController
public class StudentController {

    @CrossOrigin(origins = "http://localhost:4200")
    @PostMapping(value = "/info")
    public List<Info> addproduct(@RequestBody Info info) {
        signupDAO.add(info);
     
        List<Info> addinfo = signupDAO.getAllInfo();
     
        return addinfo;
    }

    @RequestMapping(value = "/infoDelete/{id}")
    public void deleteStudent(@PathVariable int id) {
        System.out.println("this is deleteid");
            signupDAO.delete(id);    
    }
     
    @PutMapping("/infos/{id}")
    public String updateStudent(@RequestBody Info info, @PathVariable int id) {

        info.setId(id);

        signupDAO.update(info); 

        return "info";
    }
}

LoginService.ts

webInfo(data: Student): Observable<any> {
    const url = '/info';
    return this.httpClient.post(this.serverUrl + url, data);
}

editPlan(data: Student, id: any): Observable<any> {
    const url = `/infos/${id}`;
    return this.httpClient.put(this.serverUrl + url, data);
}

deletePlan(id: any): Observable<any> {
    const url = `/infoDelete/${id}`;
    return this.httpClient.delete(this.serverUrl + url);
}

Answer 1

终于成功了..

我从 SecurityConfig.java 中删除了这一行，并且所有删除​​和编辑都正常工作。

 cors().configurationSource(request -> new CorsConfiguration().applyPermitDefaultValues())