jQuery中JSONP 前端+后端

我会带着你远行 2022-08-25 11:58 172阅读 0赞

**jQuery中JSONP**

前台代码如下：

![复制代码][copycode.gif]

<script type="text/javascript">
        $(function () {
            alert("start...");
            
            // 第一种方式
            $.ajax({
                type: "get",
                url: "http://localhost:9524/Home/ProcessCallback", // 这个就是不同于当前域的一个URL地址，这里单纯演示，所以同域
                dataType: "jsonp",
                jsonp: "jsonpcallback",  // 指定回调函数，这里名字可以为其他任意你喜欢的，比如callback，不过必须与下一行的GET参数一致
                data: "name=jxq&email=feichexia@yahoo.com.cn&jsonpcallback=?", // jsonpcallback与上面的jsonp值一致
                success: function (json) {
                    alert(json.Name);
                    alert(json.Email);
                }
            });
    
            // 第二种方式
            $.getJSON("http://localhost:9524/Home/ProcessCallback?name=xiaoqiang&email=jxqlovejava@gmail.com&jsonpcallback=?",
                function(json) {
                    alert(json.Name);
                    alert(json.Email);
                }
            );
    
            alert("end...");
        });
    </script>

![复制代码][copycode.gif]

后台Action代码如下：

![复制代码][copycode.gif]

public string ProcessCallback(string name, string email)
    {
       if (Request.QueryString != null)
       {
           string jsonpCallback = Request.QueryString["jsonpcallback"];
           var user = new User
           {
                Name = name,
                Email = email
           };

return jsonpCallback + "(" + new JavaScriptSerializer().Serialize(user) + ")";
       }
    
       return "error";
    }

![复制代码][copycode.gif]

[copycode.gif]: /images/20220824/a7e5f64c9fca4c3791fa87ca84679162.png

发表评论取消回复

表情：

评论列表（有 0 条评论，172人围观）

还没有评论，来说两句吧...

相关阅读

相关前端和后端优化

1.前端资源优化 1.1 html结构优化保证简洁、清晰的html结构，减少或避免多余的html标签使用HTML5的web语义化标签，结构清晰且利于seo c

以你之姓@/ 2024年02月20日 09:13/ 0 赞/ 48 阅读

相关前端获取后端数据

前端获取后端数据前阵子做个项目，因为涉及到前端代码，奈何前端知识有限，有个问题搞了好久。前端的js里需要一个数组，我后端都封装好了，但是这短短的距离我却不知道怎么拿

逃离我推掉我的手/ 2023年01月13日 09:00/ 0 赞/ 203 阅读

相关 jsonp使用jquery封装后调用（跨域请求）

在请求端 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JS

清疚/ 2022年12月09日 02:46/ 0 赞/ 148 阅读

相关英雄列表：前端：jquery、后端：node.js

需求分析：英雄列表 1. 后端项目运行地址：http://127.0.0.1:5000 2. 前端项目运行地址：http://127.0.0.1:3000 3. 前

灰太狼/ 2022年12月08日 15:42/ 0 赞/ 127 阅读

相关盘点前端、后端工具包

1、视频API或者播放器API API地址：[https://h5player.bytedance.com/api/][https_h5player.bytedance.co

Bertha 。/ 2022年11月29日 12:39/ 0 赞/ 178 阅读

相关 jsonp php写法,jsonp系列（四）jquery下jsonp的写法

查看手册，我们看到，jquery写jsonp有两种方式： 1$.ajax的方式 2$.getJSON的方式先来看第一种方式： (1)http://a.com/index.

我就是我/ 2022年11月17日 03:49/ 0 赞/ 220 阅读

相关 jQuery中JSONP 前端+后端

jQuery中JSONP 前台代码如下： ![复制代码][copycode.gif] <script type="text/javascript">

我会带着你远行/ 2022年08月25日 11:58/ 0 赞/ 173 阅读

相关利用jquery ajax前端与后端的文件传输

首先了解下$ ajax里面的各个属性 1.url: 要求为String类型的参数，（默认为当前页地址）发送请求的地址。 2.type: 要求为String类型的参数

本是古典何须时尚/ 2022年05月23日 08:24/ 0 赞/ 563 阅读

相关 jsonp jquery 实现跨域服务端 php

-------------------- 注： jsonp只支持get方式 -------------------- html <!DOCTYPE html

Myth丶恋晨/ 2022年05月12日 05:06/ 0 赞/ 197 阅读

相关后端(MVC)、前端(MVVM)

MVC: ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLm

╰半橙微兮°/ 2021年07月24日 23:11/ 0 赞/ 508 阅读