我正在研究 reactjs 前端，在后端使用 spring boot。我正在嘗試從前端調(diào)用端點(diǎn)，如下所示：testOktaTokenAtRest(data) { var oauth=JSON.parse(localStorage.getItem('okta-token-storage')) console.log("toekn is: ==> "+oauth.accessToken.tokenType + oauth.accessToken.accessToken) console.log("toekn received from action is inside this obj: ",data) var searchCriteria = JSON.stringify(data.data) console.log("searchCriteria data -------: " , searchCriteria) let _headerForSearch={ auth : 'Bearer ' + oauth.accessToken.accessToken } $.ajax({ method: "post", url: "http://localhost:8000/ckcapp/api/posttest", contentType: "application/json", dataType: "json", data:searchCriteria, beforeSend: function (xhr) { xhr.setRequestHeader("Authorization", _headerForSearch.auth); }, success: function(response) { console.log("response from okta enabled get api is: ",response) }, error: function(xhr, status, error) { console.log("error from okta enabled get api is: ",xhr.responseText + " " +status + " " + error ); } }); }當(dāng)我提出請(qǐng)求時(shí)，出現(xiàn)以下錯(cuò)誤：-從來(lái)源“ http://localhost: 3000”訪問(wèn)位于“ http://localhost :8000/ckcapp/api/posttest”的 XMLHttpRequest已被 CORS 策略阻止：對(duì)預(yù)檢請(qǐng)求的響應(yīng)未通過(guò)訪問(wèn)控制檢查：否請(qǐng)求的資源上存在“Access-Control-Allow-Origin”標(biāo)頭。我的 spring-boot 應(yīng)用程序具有以下配置：CORSFilter public class CORSFilter implements Filter { private static final String ONE_HOUR = "3600"; @Override public void init(FilterConfig filterConfig) throws ServletException { }
2 回答
嚕嚕噠
TA貢獻(xiàn)1784條經(jīng)驗(yàn) 獲得超7個(gè)贊
我通常使用一個(gè) bean 來(lái)配置我的 CORS 設(shè)置。
@Bean
public FilterRegistrationBean<CorsFilter> simpleCorsFilter() {
? ? UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
? ? CorsConfiguration config = new CorsConfiguration();
? ? config.setAllowCredentials(true);
? ? config.setAllowedOrigins(Collections.singletonList("*"));
? ? config.setAllowedMethods(Collections.singletonList("*"));
? ? config.setAllowedHeaders(Collections.singletonList("*"));
? ? source.registerCorsConfiguration("/**", config);
? ? FilterRegistrationBean<CorsFilter> bean = new FilterRegistrationBean<>(new CorsFilter(source));
? ? bean.setOrder(Ordered.HIGHEST_PRECEDENCE);
? ? return bean;
}
森林海
TA貢獻(xiàn)2011條經(jīng)驗(yàn) 獲得超2個(gè)贊
我將 React 與 Spring JWT 一起使用時(shí)遇到了與 CORS 策略阻止的類似問(wèn)題。
添加http.cors()到我的 SecurityConfigurer 類中以解決
@EnableWebSecurity
public class SecurityConfigurer extends WebSecurityConfigurerAdapter {
@Override
protected void configure(HttpSecurity http) throws Exception {
http.cors().and().csrf().disable().......
}
}
控制器
@CrossOrigin(origins = {"http://localhost:3000"})
@RestController
添加回答
舉報(bào)
0/150
提交
取消