1、對於前后端分離的項目來說,如果前端項目與后端項目部署在兩個不同的域下,那么勢必會引起跨域問題的出現。
針對跨域問題,我們可能第一個想到的解決方案就是jsonp,並且以前處理跨域問題我基本也是這么處理。
但是jsonp方式也同樣有不足,不管是對於前端還是后端來說,寫法與我們平常的ajax寫法不同,同樣后端也需要作出相應的更改。並且,jsonp方式只能通過get請求方式來傳遞參數,當然也還有其它的不足之處,
jQuery ajax方式以jsonp類型發起跨域請求,其原理跟<script>腳本請求一樣,因此使用jsonp時也只能使用GET方式發起跨域請求。跨域請求需要服務端配合,設置callback,才能完成跨域請求。
針對於此,我並沒有急着使用jsonp的方式來解決跨域問題,去網上找尋其它方式,也就是本文主要所要講的,在springboot中通過cors協議解決跨域問題。
2、Cors協議
H5中的新特性:Cross-Origin Resource Sharing(跨域資源共享)。通過它,我們的開發者(主要指后端開發者)可以決定資源是否能被跨域訪問。
cors是一個w3c標准,它允許瀏覽器(目前ie8以下還不能被支持)像我們不同源的服務器發出xmlHttpRequest請求,我們可以繼續使用ajax進行請求訪問。
具體關於cors協議的文章 ,可以參考http://www.ruanyifeng.com/blog/2016/04/cors.html 這篇文章,講的相當不錯。
3、springboot中解決方案
a. 創建一個filter解決跨域。
@Component public class SimpleCORSFilter implements Filter { public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException { HttpServletResponse response = (HttpServletResponse) res; response.setHeader("Access-Control-Allow-Origin", "*"); response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE, HEAD"); response.setHeader("Access-Control-Max-Age", "3600"); response.setHeader("Access-Control-Allow-Headers", "access-control-allow-origin, authority, content-type, version-info, X-Requested-With"); chain.doFilter(req, res); } public void init(FilterConfig filterConfig) {} public void destroy() {} }
b. 基於WebMvcConfigurerAdapter配置加入Cors的跨域
import org.springframework.context.annotation.Configuration; import org.springframework.web.servlet.config.annotation.CorsRegistry; import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter; @Configuration public class CorsConfig extends WebMvcConfigurerAdapter { @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping("/**") .allowedOrigins("*") .allowCredentials(true) .allowedMethods("GET", "POST", "DELETE", "PUT") .maxAge(3600); } }
如果你想做到更細致也可以使用@CrossOrigin這個注解在controller類中使用。
@CrossOrigin(origins = "http://192.168.1.10:8080", maxAge = 3600) @RequestMapping("rest_index") @RestController public class IndexController{
這樣就可以指定該controller中所有方法都能處理來自http:19.168.1.10:8080中的請求。
第一種Filter的方案也支持springmvc。
第二種常用於springboot。