前后端交互报：已被CORS策略阻止

最新推荐文章于 2025-03-26 10:54:03 发布

每天学习一点点的躺平程序员

最新推荐文章于 2025-03-26 10:54:03 发布

阅读量1k

点赞数 1

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.youkuaiyun.com/lichao_qibu/article/details/131191920

版权

当使用Axios进行前后端交互时，遇到了CORS策略的阻拦，因为响应头中缺少Access-Control-Allow-Origin。为了解决这个问题，可以在后端Controller层添加@CrossOrigin注解，允许来自不同源的请求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

项目场景：

前后端交互

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>axios基本使用</title>
</head>

<body>
    <input type="button" value="get请求" class="get">
    <input type="button" value="post请求" class="post">
    <!-- 官网提供的 axios 在线地址 -->
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script>
        document.querySelector(".get").onclick = function () {
            axios.get("http://localhost:8080/sss?qq=1")
            .then( function (response) {
                console.log(response);
            },function (err) {
                console.log(err);
            })
        }
    </script>
</body>

</html>