node的exprss框架后端处理跨域问题，然后使用axios发起请求

最新推荐文章于 2022-08-07 14:45:22 发布

前端筱攻城狮

最新推荐文章于 2022-08-07 14:45:22 发布

阅读量93

点赞数

分类专栏：前端文章标签： vue ajax nodejs

本文链接：https://blog.csdn.net/qq_26018335/article/details/118422663

版权

前端专栏收录该内容

41 篇文章 2 订阅

订阅专栏

没处理跨域前提示
跨域警告后端处理代码（只要加 res.setHeader(‘Access-Control-Allow-Origin’, ‘*’);允许所以源访问就可以了）

router.get('/test', function(req, res, next) {
    //设置响应头，设置允许跨域
    res.setHeader('Access-Control-Allow-Origin', '*');
    var sql = 'select * from blogs'
    db.query(sql, function(err, rows) {
        if (err) {
            console.log(err)
        } else {
            console.log(rows)
            res.send(rows)
        }
    });
});

然后使用axios发起请求

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>axios 发送 AJAX请求</title>
    <script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/axios/0.19.2/axios.js"></script>
</head>

<body>
    <button>GET</button>

    <script>
        // https://github.com/axios/axios
        const btns = document.querySelectorAll('button');

        //配置 baseURL
        axios.defaults.baseURL = 'http://localhost:3000';

        btns[0].onclick = function() {
            //GET 请求
            axios.get('/test', {
                //url 参数
                params: {},
                //请求头信息
                headers: {}
            }).then(value => {
                console.log(value);
            });
        }
    </script>
</body>

</html>

成功截图

前端筱攻城狮

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
node的exprss框架后端处理跨域问题，然后使用axios发起请求

没处理跨域前提示后端处理代码（只要加 res.setHeader(‘Access-Control-Allow-Origin’, ‘*’);允许所以源访问就可以了）router.get('/test', function(req, res, next) { //设置响应头，设置允许跨域 res.setHeader('Access-Control-Allow-Origin', '*'); var sql = 'select * from blogs' db.query(sql
复制链接

扫一扫