美文网首页
前端jsonp跨域请求json数据

前端jsonp跨域请求json数据

作者: lihao_李浩 | 来源:发表于2018-02-27 10:58 被阅读0次

jsonp的方式请求数据需要与后端约定好返回的数据格式 形如:callback({"a":123})
callback是前端的一个方法 括号里面的{"a":123}为前端想要的json数据

下面写一个前后端的例子

服务端:
var express = require('express');
var app = express();

app.get('/getData',function(req,res){
    var json = {
        abc:123
    };
    res.send("callback("+JSON.stringify(json)+")");
})

app.listen(3002,function(){
    console.log('run 3002');
})
前端页面:
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<script type="text/javascript">
    function callback(json){
        console.log(json);
    };
    
    var el = document.createElement('script');
    el.src = 'http://192.168.2.35:3002/getData';
    document.body.appendChild(el);
</script>
</body>
</html>
运行结果:
image.png

相关文章

  • Ajax请求跨域问题

    遇到ajax请求跨域问题,解决方式,改dataType为jsonp json和jsonp返回数据格式json格式 ...

  • JSONP的劫持

    关于 JSONP JSONP 全称是 JSON with Padding ,是基于 JSON 格式的为解决跨域请求...

  • 关于jsonp劫持

    关于jsonp JSONP 全称是 JSON with Padding ,是基于 JSON 格式的为解决跨域请求资...

  • 前端jsonp跨域请求json数据

    jsonp的方式请求数据需要与后端约定好返回的数据格式 形如:callback({"a":123})callba...

  • ajax(2)

    6.jsonp跨域请求 7、JSON的了解?XML和JSON的区别?

  • javasscript - 收藏集 - 掘金

    jsonp 跨域请求详解——从繁至简 - 前端 - 掘金什么是jsonp?为什么要用jsonp?JSONP(JSO...

  • 跨域实战解决方案

    一.跨域方案 1.JSONP跨域 (1)前端发起jQuery ajax 的get请求 $.getJSON...

  • 跨域

    关于跨域大概可以分为 iframe 的跨域和纯粹的跨全域请求。 3种跨全域方法: 1、JSONP 全称:JSON ...

  • 跨域的解决方式与演示

    关于跨域大概可以分为 iframe 的跨域和纯粹的跨全域请求。 3种跨全域方法: 1、JSONP 全称:JSON ...

  • 跨域

    博客 说说跨域那些事儿 不要再问我跨域的问题了 前端常见跨域解决方案(全) 同源策略 JSONP(填充式JSON)...

网友评论

      本文标题:前端jsonp跨域请求json数据

      本文链接:https://www.haomeiwen.com/subject/nwypxftx.html