springboot for backend reactjs frontend

Question

我使用springboot和reactjs的一切工作之前添加安全后端，现在去网页检索我的数据，我没有看到任何数据在那里。我去控制台，它说用户名没有定义:不知道这是什么意思

跨域请求阻塞:同源策略不允许读取远程资源http://localhost:8080/users/undefined/todos。(原因:CORS请求未成功)

更新:我尝试了两个代码，但没有帮助。这是什么严重的问题吗?

"Uncaught (in promise) Error: Network Error
at createError" (createError.js:16)
Access to XMLHttpRequest at 'http://localhost:8080/users/undefined/todos' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
xhr.js:177 GET http://localhost:8080/users/undefined/todos net::ERR_FAILED
dispatchXhrRequest @ xhr.js:177
xhrAdapter @ xhr.js:13
todos:1 Access to XMLHttpRequest at 'http://localhost:8080/users/undefined/todos' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
xhr.js:177 GET http://localhost:8080/users/undefined/todos net::ERR_FAILED
dispatchXhrRequest @ xhr.js:177
xhrAdapter @ xhr.js:13
dispatchRequest @ dispatchRequest.js:52

createError.js:16 Uncaught (in promise) Error: Network Errorat createError (createError.js:16)

Answer 1

添加@CrossOrigin(origins = "http://localhost:3000")(如果您的客户端运行在3000)，或使用此bean(在SecurityConfig中):

@Bean
public CorsConfigurationSource corsConfigurationSource() {
final CorsConfiguration configuration = new CorsConfiguration();
configuration.setAllowedOrigins(Arrays.asList("http://localhost:3000"));
configuration.setAllowedMethods(Arrays.asList("GET", "POST", "OPTIONS"));
configuration.setAllowCredentials(true);
configuration.setAllowedHeaders(Arrays.asList("*"));
configuration.setExposedHeaders(Arrays.asList("x-auth-token", "xsrf-token"));
final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", configuration);
return source;
}