Springboot使用cors解決跨域問題

Springboot使用cors解決跨域問題

首先我們啓動兩個項目 一個8080 一個8081

8080提供一個hello接口 非常的簡單

8081寫一個靜態頁面進行訪問

8080java代碼

@RestController
public class HelloController {

    @GetMapping("/hello")
    public String hello(Model model){
        return "hello";
    }
}

8081靜態頁面代碼

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jq.js"></script>
</head>
<body>
<div id="app"></div>
<button onclick="getData()">請求</button>
<script>
    function getData(){
        $.get("http://localhost:8080/hello",function (msg) {
            $("#app").html(msg)
        })
    }
</script>
</body>
</html>

我們進行訪問 點請求

在這裏插入圖片描述

我們可以看到報了個錯No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

這就是典型的跨域問題

下面我們使用cors從後端進行解決 大家其實都知道 很多時候呢我們都是吧跨域認爲是前端的問題 確實是前端的問題,但是呢 我們後端也是可以解決的 那麼很簡單 我們只需要一個註解即可解決

@RestController
public class HelloController {
    @GetMapping("/hello")
    @CrossOrigin(origins = "http://localhost:8081")
    public String hello(Model model){
        return "hello";
    }
}

我們在這個方法上加一個CrossOrigin這個註解 給origins一個可訪問的ip即可

這樣我們就解決了跨域問題

但是呢 現在是解決了這個hello的藉口的問題

那麼其他的呢

這個註解也可以放在類上面的 那麼在這個類裏面的接口都是可以被訪問的

那麼再其他的呢

當然可以 做一個全局的配置 我們需要寫一個class來重寫他默認的配置

@Configuration
public class WebMavConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        //所以的接口都是可以的                //所有的人都是可以訪問的
        registry.addMapping("/**").allowedOrigins("*")
                //所有的頭都可以訪問
                .allowedHeaders("*")
                //所有的方法都可以訪問
                .allowedMethods("*");
    }
}

我寫在這兒了 就不過解釋了 註釋很清楚

//所有的方法都可以訪問
.allowedMethods("*");
}
}


我寫在這兒了  就不過解釋了  註釋很清楚

那麼好 我是夢凡  加油!
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章