怎么理解服務(wù)器的跨域訪問

本篇內(nèi)容介紹了“怎么理解服務(wù)器的跨域訪問”的有關(guān)知識，在實際案例的操作過程中，不少人都會遇到這樣的困境，接下來就讓小編帶領(lǐng)大家學習一下如何處理這些情況吧！希望大家仔細閱讀，能夠?qū)W有所成！

跨域訪問問題，一般是由于瀏覽器同源策略保護引起。

目前最為安全且流行的是使用服務(wù)器代理，使得前后端處于同源。

一、這種方式運用的就是服務(wù)器的反向代理技術(shù)，控制客戶端和服務(wù)器的訪問都從代理服務(wù)器經(jīng)過，比如用nginx作為服務(wù)器代理，在nginx上配置客戶端和第三方服務(wù)的反向代理，這樣就可保證客戶端、第三方是同源的了，同一個源，都來自代理服務(wù)器。

二、JSONP

jsonp解決跨域問題的原理是，瀏覽器的script標簽是不受同源策略限制的，我們可以在script標簽中訪問任何域名下的資源文件。利用這一特性，用script標簽從服務(wù)器中請求數(shù)據(jù)，同時服務(wù)器返回一個帶有方法和數(shù)據(jù)的js代碼，請求完成，調(diào)用本地的js方法，來完成數(shù)據(jù)的處理。
不推薦使用jsonp，首先jsonp是一種非官方的方法，而且這種方法只支持GET方法，不如POST方法安全；而且一般前后端分離最通用的方法是返回統(tǒng)一的json格式。

三、服務(wù)器端跨域訪問設(shè)置

對于spring boot

controller啟用@CrossOrigin：如@CrossOrigin(origins = "http://xxx.com", maxAge = 3600)

origins  ： 允許可訪問的域列表
maxAge：準備響應(yīng)前的緩存持續(xù)的最大時間（以秒為單位）。

也可以在filter設(shè)置

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");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Headers", "x-requested-with");
        chain.doFilter(req, res);
    }

或者攔截器

@Configuration
public class MyConfiguration extends WebMvcConfigurerAdapter  {

    @Override  
    public void addCorsMappings(CorsRegistry registry) {  
        registry.addMapping("/**")  
                .allowCredentials(true)  
                .allowedHeaders("*")  
                .allowedOrigins("*")  
                .allowedMethods("*");  

    }  
}

或者注入bean

@Bean
    public CorsFilter corsFilter() {
        final UrlBasedCorsConfigurationSource urlBasedCorsConfigurationSource = new UrlBasedCorsConfigurationSource();
        final CorsConfiguration corsConfiguration = new CorsConfiguration();
        /*是否允許請求帶有驗證信息*/
        corsConfiguration.setAllowCredentials(true);
        /*允許訪問的客戶端域名*/
        corsConfiguration.addAllowedOrigin("*");
        /*允許服務(wù)端訪問的客戶端請求頭*/
        corsConfiguration.addAllowedHeader("*");
        /*允許訪問的方法名,GET POST等*/
        corsConfiguration.addAllowedMethod("*");
        urlBasedCorsConfigurationSource.registerCorsConfiguration("/**", corsConfiguration);
        return new CorsFilter(urlBasedCorsConfigurationSource);
    }

“怎么理解服務(wù)器的跨域訪問”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識可以關(guān)注億速云網(wǎng)站，小編將為大家輸出更多高質(zhì)量的實用文章！