先後端分離時,跨域問題如何解決?

首先關於先後端分離開發  跨域問題的解決思路有多種,小喵只知道幾種,藉此分享給你們,

        1. 使用Nginx代理: Nginx統一程序入口,經過Nginx分發到不一樣的服務.

        2.JSONP,經過<script>標籤請求接口,經過回調函數的方式傳遞跨域數據.

        3.CORS,一個W3C標準,全稱是"跨域資源共享"(Cross-origin resource sharing),

                CORS 須要瀏覽器和服務器同時支持.

                 全部瀏覽器都支持該功能.

                 服務器須要單獨配置使用  @CrossOrigin 或 全局配置類

小喵採用的是第三種方法 :

一 . SpringBoot開發

     首先,咱們能夠採用在每一個controller上都寫一個註解 @ CrossOrigin 

但這種方式只限於controller較少的狀況下使用,controller多的狀況下,配置的有點麻煩.

所以咱們採用全局配置類,將全局配置類放在包的根下面??.config 包下(注: 該包根據項目建立時的包名配置)

代碼 :

package com.czxy.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;


/**  全局跨域配置類
 * Created by liangtong.
 */
@Configuration
public class GlobalCorsConfig {
    @Bean
    public CorsFilter corsFilter() {
        //1.添加CORS配置信息
        CorsConfiguration config = new CorsConfiguration();
        //放行哪些原始域
        config.addAllowedOrigin("*");
        //是否發送Cookie信息
        config.setAllowCredentials(true);
        //放行哪些原始域(請求方式)
        config.addAllowedMethod("OPTIONS");
        config.addAllowedMethod("HEAD");
        config.addAllowedMethod("GET");     //get
        config.addAllowedMethod("PUT");     //put
        config.addAllowedMethod("POST");    //post
        config.addAllowedMethod("DELETE");  //delete
        config.addAllowedMethod("PATCH");
        config.addAllowedHeader("*");

        //2.添加映射路徑
        UrlBasedCorsConfigurationSource configSource = new UrlBasedCorsConfigurationSource();
        configSource.registerCorsConfiguration("/**", config);

        //3.返回新的CorsFilter.
        return new CorsFilter(configSource);
    }

}

二 . 微服務開發(Spring Boot + Spring Cloud)

微服務開發時咱們只須要將全局配置類方到網關下面便可

這樣就能夠完成跨域問題的解決!

但願你們多給小喵一點支持和關注!!!

小喵在這謝謝了!!!!

(^_^)~喵~!!