<script src="https://cdn.jsdelivr.net/gh/jquery/jquery@3.4.1/dist/jquery.js"></script>
<script>
//1、首先我事先定义好一个函数,主要是用来处理执行返回过来的
// fn({"error_code":0,"reason":"数据返回成功","result":[]})
//因为看返回来的数据,在js语境中,我们都知道这是一个函数执行的形式,如果没有定义它的话
// 就会出现fn is not defined的语法错误
function fn(data){
//最后我们就可以获取数据了
console.log(data.result);
}
$("#clickMe").click(function(){
//2、为了能够获取到后端返回的数据,需要我们指定一个容器放好,并且需要把容器名称作为键值对的形式传到后台去
var url = 'http://localhost:3000/users?callback=fn';
//创建节点
var script = document.createElement('script');
//添加url地址
script.src = url;
//追加到body的后面
$("body").append(script);
});
</script>
下面是后端部分代码,需要用到nodejs处理方式。
-user路由
var express = require('express');
var router = express.Router();
/* GET users listing. */
router.get('/', function(req, res, next) {
//3、我这里接收好前台发给我的callback容器性对应的参数
var fn = req.query.callback;
console.log(fn);
//定义好响应数据格式,以json格式
var callback = {
error_code:0,
reason:'数据返回成功',
//result里面存放的一般都是从数据库中获取的数据,现在我用假数据来模拟
result:[
{
id:1,
username:'knity',
title:'程序中一个迷途小书童',
hobby:'就喜欢粘着你',
age:18,
info:'幸福大概就是你喜欢粘着的那个人'
},
]
}
//4、响应数据,因为是字符串的拼接,所以这里需要用JSON.strigify()将json数据字符串化,再执行返回数据
res.send(fn+"("+JSON.stringify(callback)+")");
});
module.exports = router;
下面是app.js部分
var express = require('express');
var path = require('path');
//引入外置路由
var usersRouter = require('./routes/users');
var app = express();
//注册路由
app.use('/users', usersRouter);
//设置监听端口号
var port = 3000;
app.listen(port,()=>{
console.log('this server is running at '+port)
})
//暴露
module.exports = app;