js Ajax发送请求

js发送请求

不同框架发送请求方式不一样
有vue.js发送，有jquery 方式发送
这里用jquery方式发送

1.引入jquery.js

<script src="assets/js/jquery-3.3.1.min.js"></script>
<script src="assets/js/jquery.magnific-popup.min.js"></script>

如果显示 $.ajax is not a function错误，则是js文件的错误，可能版本不对或者更新问题，可换js就可以了。
我用的JQuery CDN 在线引用其他版本：的压缩版。
参考 https://blog.csdn.net/qq_44214671/article/details/113320568

2.如果报跨域的错

如果报错：

或
CORS的错，就是跨域的问题了。
解决办法：后端解决。这里是用flask的后端。
1.安装flask_cors pip安装
2.from flask_cors import CORS
3.app = Flask(name)
CORS(app, supports_credentials=True,resources=r'/*') 加这句

就可以请求到啦。

以下是前端请求的代码。

<!DOCTYPE html>
<html lang="zh">
<head>
    
    <meta charset="UTF-8">
    <title>JQuery中Ajax的基本使用</title>
</head>
<body>
<button id="btn">JQuery中Ajax的基本使用</button>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script>
    
    $("#btn").click(function () {
        $.ajax({
            type: "get",
            //url: "http://167.100.100.100:5000/test_1",
            url: "http://127.0.0.1:5000/test_1",

           data: 'name=lrq&age=123',
           // data: JSON.stringify({
             //   'name':'lrq',
              //  'age':'123'
           // }),
        //   jsonpCallback: "callback",
            //crossDomain: true,  
          //  headers:{"Access-Control-Allow-Origin":"*","Content-Type":"text/plain;charset=UTF-8"},
           // contentType: "application/json",
            success: function (resp) {
                console.log((resp));
            }
        });
    })
</script>
</body>
</html>

可以啦。

posted @ 2022-10-17 22:22  高柴小生  阅读(250)  评论(0)  编辑  收藏  举报