通过ajax的jsonp方式实现跨域访问,并处理响应

一、场景描述

现有一个项目A,需要请求项目B的某个接口,并根据B接口响应结果A处理后续逻辑。

二、具体实现

1、前端

前端项目A发送请求,这里通过jsonp的方式实现跨域访问。

html 复制代码
       $.ajax({    
            url:'http://10.10.2.256:8280/ssoCheck',   //请求的url地址
            data:{'userId':'1'}, //参数
            dataType:"jsonp",   //返回格式为json
            type:"GET",   //请求方式
            jsonpCallback:"successCallBack"//回调方法

        });

注意,需要指定jsonp的回调方法jsonpcallback,这里我设置的回调方法名为successCallBack,所以相应的 要定义一个successCallBack方法。

html 复制代码
function successCallBack(data){
        //后端返回接口
       if (data && data.code == '200'){
          //自己逻辑
       }
    }

2、 后端

后端需要注意返回的json格式,必须严格返回 successCallBack({}) 格式的。

(successCallBack也就是前端配置的回调方法名),否则回调方法无法执行。

3、效果展示

相关推荐
可触的未来,发芽的智生5 分钟前
微论-自成长系统引发的NLP新生
javascript·人工智能·python·程序人生·自然语言处理
八哥程序员17 分钟前
你真的理解了 javascript 中的原型及原型链?
前端·javascript
冴羽24 分钟前
10 个 Nano Banana Pro 专业级生图技巧
前端·人工智能·aigc
7ayl34 分钟前
Vue3 - runtime-core的渲染器初始化流程
前端·vue.js
前端老宋Running1 小时前
React 的“时光胶囊”:useRef 才是那个打破“闭包陷阱”的救世主
前端·react.js·设计模式
yinuo1 小时前
前端跨页面通讯终极指南③:LocalStorage 用法全解析
前端
隔壁的大叔1 小时前
正则解决Markdown流式输出不完整图片、表格、数学公式
前端·javascript
胡楚昊1 小时前
CTF SHOW逆向
java·服务器·前端
San301 小时前
深入 JavaScript 原型与面向对象:从对象字面量到类语法糖
javascript·面试·ecmascript 6
拉不动的猪1 小时前
前端JS脚本放在head与body是如何影响加载的以及优化策略
前端·javascript·面试