跨域理解及服务器端解决跨域问题
1.跨域請求,就是這個服務器去拿另一個服務器的資源,另一個服務器的域名肯定和當前的服務器域名不一樣嘛。
瀏覽器默認是不允許跨域請求的,是瀏覽器對JavaScript施加的安全限制。是瀏覽器對JavaScript施加的安全限制。是瀏覽器對JavaScript施加的安全限制。
由于瀏覽器同源策略,凡是發送請求url的協議、域名、端口三者之間任意一與當前頁面地址不同即為跨域。
?
所謂同源是指,域名,協議,端口均相同,不明白沒關系,舉個栗子:
http://www.123.com/index.html 調用 http://www.123.com/server.PHP?(非跨域)
http://www.123.com/index.html 調用 http://www.456.com/server.php?(主域名不同:123/456,跨域)
http://abc.123.com/index.html 調用 http://def.123.com/server.php (子域名不同:abc/def,跨域)
http://www.123.com:8080/index.html 調用 http://www.123.com:8081/server.php (端口不同:8080/8081,跨域)
http://www.123.com/index.html 調用 https://www.123.com/server.php (協議不同:http/https,跨域)
請注意:localhost和127.0.0.1雖然都指向本機,但也屬于跨域。
瀏覽器執行javascript腳本時,會檢查這個腳本屬于哪個頁面,如果不是同源頁面,就不會被執行。
?
服務器端解決跨域問題的三種方法
跨域是指html文件所在的服務器與ajax請求的服務器是不同的ip+port,例如:?
- ‘192.168.1.1:8080’ 與 ‘192.168.1.2:8080’是不同的域。?
- ‘192.168.1.1:8080’ 與 ‘192.168.1.1:8081’是不同的域。
解決此類問題的方法很多,有需要客戶端和服務端都要更改的,例如jsonp,iframe等等;有只需要客戶端更改的,這種情況只能出現在hybrid app開發中,即通過調用native方法來進行網絡請求;有只需要服務端配置的,下面介紹3種服務端配置的方法。
第一種
如果您使用的mvc框架是spring4.2以上的話,一個@CrossOrigin就可以搞定。將@CrossOrigin加到Controller上,那么這個Controller所有的請求都是支持跨域的,代碼如下:
@Controller @CrossOrigin public class GreetingController {將@CrossOrigin加到請求方法上,那么這個請求是支持跨域的,代碼如下
@CrossOrigin@RequestMapping("/greeting")public @ResponseBody Greeting greeting(@RequestParam(required=false, defaultValue="World") String name) {第二種
全局配置,也需要spring4.2以上。
@Beanpublic WebMvcConfigurer corsConfigurer() {return new WebMvcConfigurerAdapter() {@Overridepublic void addCorsMappings(CorsRegistry registry) {registry.addMapping("/greeting-javaconfig").allowedOrigins("http://localhost:9000");}};}.addCorsMappings()中的參數代表支持跨域的url,.allowedOrigins()中的參數代表可以訪問該接口的域名,設置為”*”可支持所有域。
第三種
這種方法就跟框架無關了,需要兩個jar包,點擊這里進行下載,兩個jar包可以放的程序里,也可以放到tomcat中,然后將下面的配置寫到web.xml中就可以了
< filter > < filter-name > CORS </ filter-name > < filter-class > com.thetransactioncompany.cors.CORSFilter </ filter-class > < init-param > < param-name > cors.allowOrigin </ param-name > <!--配置授信的白名單的域名!-->< param-value > * </ param-value > </ init-param > < init-param > < param-name > cors.supportedMethods </ param-name > < param-value > GET, POST, HEAD, PUT, DELETE </ param-value > </ init-param > < init-param > < param-name > cors.supportedHeaders </ param-name > < param-value > Accept, Origin, X-Requested-With, Content-Type, Last-Modified </ param-value > </ init-param > < init-param > < param-name > cors.exposedHeaders </ param-name > < param-value > Set-Cookie </ param-value > </ init-param > < init-param > < param-name > cors.supportsCredentials </ param-name > < param-value > true </ param-value > </ init-param > </ filter > < filter-mapping > < filter-name > CORS </ filter-name > < url-pattern > /* </ url-pattern > </ filter-mapping >?
總結
以上是生活随笔為你收集整理的跨域理解及服务器端解决跨域问题的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: C#序列化反序列化对象为base64字符
- 下一篇: Servlet——简单用户登录实例+ht