0

0

jQuery+JSONP跨域需要怎样实现

php中世界最好的语言

php中世界最好的语言

发布时间:2018-03-14 15:48:48

|

1908人浏览过

|

来源于php中文网

原创

这次给大家带来jQuery+JSONP跨域需要怎样实现,jQuery+JSONP跨域实现的注意事项有哪些,下面就是实战案例,一起来看一下。

了解了jsonp之后,大家应该也都明白了,jsonp主要就是用来实现跨域的获取数据,今天我们就来详细探讨下如何在实际中应用jsonp实现跨域

  JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。由于同源策略,一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通,而 HTML 的

  上面一段话来自百度百科,概念永远是那么抽象难懂,看例子才是最直观的表现。例子看的多了,领悟到那个点了,自然自己也会学着抽象的描述了。这就是为什么常说“学习知识是从薄到厚,又由厚到薄的过程”。好了扯远了。下面直接来看一个例子。

 

  问题:本地现有一个页面demo.html需要从http://localhost:3561/User/GetAllNames获取数据并展示。

  解答:由于问题中的两方不在同一服务器,故需要使用jsonp来跨域访问。

  ① 客户端编写

  客户端使用jQuery中提供的$.getJson方法来跨域访问。getJson有3个参数:

    I.   url:请求地址;

    II.  data:发送到服务端的参数;

    III. callback:成功时的回调函数。

  getJson的使用方法和普通的$.get方法基本一致,不同的地方在于getJson需要在url后面的参数部分加上callback=?这一固定部分,jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。然后在回调函数中操作从异域返回的json对象,回调函数callback的参数即为该json对象。





  


  

      ② 服务端编写

      服务端的逻辑主要是将数据序列化为json字符串,然后封装成"callback(json)"的形式,callback为jQuery自动生成并传到服务端的函数名称。下面使用C#实现:

    public class UserController : Controller
    {
        public string GetAllNames(string callback)
      {
        string[] names = new string[] { "张三丰", "张无忌", "令狐冲", "杨过", "郭靖" };
        JavaScriptSerializer jss = new JavaScriptSerializer();
        string json = jss.Serialize(names);
        return string.Format("{0}({1})", callback, json);
      }
    }

      至此,便成功解决了问题。

     思考:如果服务端已经写死了callback(如:return string.Format("moty({0})", json);),那么客户端该怎么写呢?

     参考:

    $.ajax("http://localhost:3561/User/GetAllNames", {
      jsonpCallback: "moty",
      dataType: "jsonp",
      success: function(json) {
        for (var i = 0; i < json.length; i++) {
          $("#nameList").append("
  • " + json[i] + "
  • "); } } });

    相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

    推荐阅读:

    jquery中select组件的使用方法

    如何实现jquery回车登录效果

    元典智库
    元典智库

    元典智库:智能开放的法律搜索引擎

    下载

    鼠标移出事件的案例以及详解

    jQuery自定义函数应用以及解析

    热门AI工具

    更多
    DeepSeek
    DeepSeek

    幻方量化公司旗下的开源大模型平台

    豆包大模型
    豆包大模型

    字节跳动自主研发的一系列大型语言模型

    通义千问
    通义千问

    阿里巴巴推出的全能AI助手

    腾讯元宝
    腾讯元宝

    腾讯混元平台推出的AI助手

    文心一言
    文心一言

    文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

    讯飞写作
    讯飞写作

    基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

    即梦AI
    即梦AI

    一站式AI创作平台,免费AI图片和视频生成。

    ChatGPT
    ChatGPT

    最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

    相关专题

    更多
    2026赚钱平台入口大全
    2026赚钱平台入口大全

    2026年最新赚钱平台入口汇总,涵盖任务众包、内容创作、电商运营、技能变现等多类正规渠道,助你轻松开启副业增收之路。阅读专题下面的文章了解更多详细内容。

    54

    2026.01.31

    高干文在线阅读网站大全
    高干文在线阅读网站大全

    汇集热门1v1高干文免费阅读资源,涵盖都市言情、京味大院、军旅高干等经典题材,情节紧凑、人物鲜明。阅读专题下面的文章了解更多详细内容。

    40

    2026.01.31

    无需付费的漫画app大全
    无需付费的漫画app大全

    想找真正免费又无套路的漫画App?本合集精选多款永久免费、资源丰富、无广告干扰的优质漫画应用,涵盖国漫、日漫、韩漫及经典老番,满足各类阅读需求。阅读专题下面的文章了解更多详细内容。

    50

    2026.01.31

    漫画免费在线观看地址大全
    漫画免费在线观看地址大全

    想找免费又资源丰富的漫画网站?本合集精选2025-2026年热门平台,涵盖国漫、日漫、韩漫等多类型作品,支持高清流畅阅读与离线缓存。阅读专题下面的文章了解更多详细内容。

    12

    2026.01.31

    漫画防走失登陆入口大全
    漫画防走失登陆入口大全

    2026最新漫画防走失登录入口合集,汇总多个稳定可用网址,助你畅享高清无广告漫画阅读体验。阅读专题下面的文章了解更多详细内容。

    13

    2026.01.31

    php多线程怎么实现
    php多线程怎么实现

    PHP本身不支持原生多线程,但可通过扩展如pthreads、Swoole或结合多进程、协程等方式实现并发处理。阅读专题下面的文章了解更多详细内容。

    1

    2026.01.31

    php如何运行环境
    php如何运行环境

    本合集详细介绍PHP运行环境的搭建与配置方法,涵盖Windows、Linux及Mac系统下的安装步骤、常见问题及解决方案。阅读专题下面的文章了解更多详细内容。

    0

    2026.01.31

    php环境变量如何设置
    php环境变量如何设置

    本合集详细讲解PHP环境变量的设置方法,涵盖Windows、Linux及常见服务器环境配置技巧,助你快速掌握环境变量的正确配置。阅读专题下面的文章了解更多详细内容。

    0

    2026.01.31

    php图片如何上传
    php图片如何上传

    本合集涵盖PHP图片上传的核心方法、安全处理及常见问题解决方案,适合初学者与进阶开发者。阅读专题下面的文章了解更多详细内容。

    2

    2026.01.31

    热门下载

    更多
    网站特效
    /
    网站源码
    /
    网站素材
    /
    前端模板

    精品课程

    更多
    相关推荐
    /
    热门推荐
    /
    最新课程
    jQuery 教程
    jQuery 教程

    共42课时 | 5.2万人学习

    HTML+CSS基础与实战
    HTML+CSS基础与实战

    共132课时 | 10万人学习

    tp6+adminlte搭建通用后台
    tp6+adminlte搭建通用后台

    共39课时 | 5.8万人学习

    关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
    php中文网:公益在线php培训,帮助PHP学习者快速成长!
    关注服务号 技术交流群
    PHP中文网订阅号
    每天精选资源文章推送

    Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号