• JSONP调用MVC后台接口


    JSONP前台调用代码:

    1、Jquery第一种方式:

     $.ajax({
                    "url": "http://localhost:59403/api/Login",    //url自行设定
                    "type": "get",
                    "timeout": 1000,
                    "async": false,
                    "data": {
                        "userName": txtName,
                        "pwd": txtPwd
                    },
                    "dataType": "jsonp",
                    "jsonp": "CallBackFun_Key",    //这是告诉后台:我的【回调函数】这个参数的key(其实就是回调函数的名字的名字,干!)
                    "jsonpCallback": "CallBackFun_Name",    //这是告诉后台:我的【回调函数】这个参数的value(其实就是回调函数的名字)
                    "success": function (data) {
                        alert("success:" + data);
                    },
                    "error": function (XMLHttpRequest, textStatus, errorThrown) {
                        switch (XMLHttpRequest.readyState) {
                            case 0:
                                //(未初始化)还没有调用send()方法
                                break;
                            case 1:
                                //(载入)已调用send()方法,正在发送请求
                                break;
                            case 2:
    
                                //(载入完成)send()方法执行完成,已经接收到全部响应内容
                                break;
                            case 3:
                                //(交互)正在解析响应内容
                                break;
                            case 4:
                                //(完成)响应内容解析完成,可以在客户端调用了
                                break;
                        }
                        alert("Exception");
                    }
                });
    View Code

     2、Jquery第二种方式:

    $.getJSON("http://localhost:59403/api/Orgs?jsonpcallback=?",
                function (json) {
                    alert(json[0].OrgId);
      }

     .net 后台程序

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;
    using LionTravel.LionTalk.ApiServer.Common;
    using System.Net.Http;
    using System.Text;
    
         //后台创建如下方法:
            public HttpResponseMessage Get(string userName, string pwd)
            {
                //控制器捕获到的请求参数,默认下标为0的,是回调函数的信息:{key:value} ==> {ajax中jsonp参数 : ajax中jsonpCallback参数}
                string ClientCallBackFunName = this.Request.GetQueryNameValuePairs().ToList()[0].Value;
                //拼接返回参数
                HttpResponseMessage result = new HttpResponseMessage
                {
                    //这里回调函数直接用上方获取的变量
                    Content = new StringContent(ClientCallBackFunName + "(1000)",
                        Encoding.GetEncoding("UTF-8"), "application/json")
                };
    
                return result;
            }
  • 相关阅读:
    高级前端工程师面试必备(持续更新中)
    用node编写cli工具
    用vscode开发vue应用
    jsbridge的js封装
    react-create-app 构建react项目的流程以及需要注意的地方
    【面试篇】寒冬求职季之你必须要懂的原生JS(中)
    基于vue-cli3.0构建功能完善的移动端架子,主要功能包括
    @vue/cl构建得项目下,postcss.config.js配置,将px转化成rem
    eslint prettier editrorconfig
    数据结构题集--集锦
  • 原文地址:https://www.cnblogs.com/zhangweidong/p/5168832.html
Copyright © 2020-2023  润新知