Jsonp跨域的坑,关于jsonp你真的了解吗

news2024/11/29 0:38:51

先来介绍Jsonp跨域

  1. Jsonp全称是Json with Padding,和Json没有关系

  2. Json是一种数据交换格式,而Jsonp是一种依靠开发人员聪明才智创造出的一种费官方跨域数据交换协议。json是描述信息的格式,jsonp是信息传输的协议

    在页面上直接发送一个跨域的ajax请求四不可以的,但是,在网页上引入不同域上的js脚本却是可以自由访问的。

    于是,人们想到了利用这个漏斗可以很好的解决跨域请求:后端不返回json格式的数据,而是返回一段调用某个函数的js代码,供前端来调用处理,使用跨域。

  3. 众所周知,后端一般给前端返回json数据,而使用Jsonp的特殊就在于前端后传递一个callback参数(key)给后端,接着后端返回数据是会将这个callback参数的值(value)作为函数来包裹住json数据,最终返回给前端就是一段js代码了,这样就巧妙的解决了跨域问题

我遇到的坑

本来自己在开发一个桌面端应用,因为只有一个接口,而且是get请求,遇到了跨域问题,那么我第一反应是使用jsonp来解决跨域,最简单的方法。
结果我没有请求到数据,报了如下错误

jsonp跨域请求报错Uncaught SyntaxError: Unexpected token :

这到底怎么回事,我的请求地址也没有问题,也没有‘:’这个符号呀,到底怎么回事。
在这里插入图片描述

经过我查阅各种文献发现,jsonp跨域请求,**需要和后端协商,*也就是
传递一个callback参数(key)给后端,接着后端返回数据是会将这个callback参数的值(value)作为函数来包裹住json数据,最终返回给前端就是一段js代码了

然后呢,我立马去找后端人员,让他别给我返回json格式的数据了,我们公司的高级后端,于是就开始研究jsonp跨域,改个接口,给我改了半天,一个月几万的人。
改了半天还没有给我改过来,后来他发现,后端另一个人把返回的数据进行了封装,导致返回的还是json的代码,最后他终于改过来了。
害,我还一直以为是前端的问题。浪费我这么久时间。
在这里插入图片描述

总结

本来以为jsonp是最简单的解决跨域的方式,结果给我遇到这么多问题,耗费了好多时间和精力,我恨呀。
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/41685.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

树莓派之树莓派系统安装

树莓派系统安装 概述 树莓派(是为学习计算机编程教育而设计),只有信用卡大小的微型电脑,其系统基于Linux。随着Windows 10 IoT的发布,我们也将可以用上运行Windows的树莓派。2014年刚知道有树莓派的时候好奇买了一块,型号&#x…

DSP-IIR滤波器设计

目录 滤波器的性能指标: 常用的模拟滤波器: 巴特沃斯滤波器: 巴特沃斯滤波器设计——一般已知Ωp及其衰减指标,Ωs及其衰减指标求得A,ε,N,Ωc: 巴特沃斯滤波器设计例题: 切比…

Python系列-Django

文章目录Python系列-Django用django实现社交媒体 social_book基本演示,点击可查看视频整体项目的创建数据库设计,基本用户创建表的设计 models.py创建用户查看数据库插件 database navigator登录、注册的实现用djangovue实现社交媒体 social_bookPython系…

【Java集合】Collection接口常用方法

文章目录Collection接口和常用方法> Collection接口常用方法> Collection接口遍历元素:使用Iterator(迭代器)> Collection接口遍历元素:增强 for 循环Collection接口和常用方法 Collection接口实现类的特点:…

CPU中的核与进程,线程间的关系讲解(操作系统基础概念)

CPU中的核与进程,线程间的关系讲解(操作系统基础概念) CPU中的内核 概念 CPU内核(Die)是CPU中间的核心芯片,由单晶硅制成,用来完成所有的计算、接受/存储命令、处理数据等,是数字…

Node.js | 详解 JWT 登录验证 的工作原理

🧑‍💼 个人简介:一个不甘平庸的平凡人🍬 🖥️ 本系列专栏:Node.js从入门到精通 🖥️ TS知识总结:十万字超详细TS知识点总结 👉 你的一键三连是我更新的最大动力❤️&…

【Java系列】一篇文章快速了解Java语言概述

Java语言概述1.Java简介2.JVM2.1JVM介绍2.2JVM特性3.Java特性4.搭建Java程序开发环境5.编写第一个Java应用程序6.小结第一个程序1.Java简介 java是面向对象的一门程序设计语言随着Java技术在web方面的不断成熟,已经成为Web应用程序的首选开发语言。后台开发&#x…

FRP进阶篇之安全认证

目录 一、前言 二、通信加密 1、概述 2、使用 三、BasicAuth 鉴权 1、概述 2、使用 2.1、客户端配置 2.2、启动客户端 2.3、效果验证 四、TLS双向身份验证 1、概述 2、使用 2.1、生成证书 2.2、服务端配置 2.3、客户端配置 一、前言 通过上次的《FRP入门篇》相信…

毕业设计-机器学习图像卡通动漫化图像风格迁移

前言 📅大四是整个大学期间最忙碌的时光,一边要忙着备考或实习为毕业后面临的就业升学做准备,一边要为毕业设计耗费大量精力。近几年各个学校要求的毕设项目越来越难,有不少课题是研究生级别难度的,对本科同学来说是充满挑战。为帮助大家顺利通过和节省时间与精力投…

关于旅游景点主题的HTML网页设计——北京景点 7页(带订单购物车)Html+Css+javascript

⛵ 源码获取 文末联系 ✈ Web前端开发技术 描述 网页设计题材,DIVCSS 布局制作,HTMLCSS网页设计期末课程大作业 | 游景点介绍 | 旅游风景区 | 家乡介绍 | 等网站的设计与制作 | HTML期末大学生网页设计作业,Web大学生网页 HTML:结构 CSS&…

redhat 新开启一个ssh端口

查看是否安装ssh服务 rpm -qa |grep ssh2.开启ssh服务 systemctl start sshd.service3.修改ssh配置文件 vi /etc/ssh/sshd_config4.复制Port行并修改端口号 此时已经新增了一个端口 5.启用新端口 sudo semanage port -a -t ssh_port_t -p tcp 22116.防火墙放开新增的端口 …

最全面的SpringMVC教程(二)——SpringMVC核心技术篇

前言 本文为 【SpringMVC教程】核心技术篇 相关详细介绍,具体将对视图和模型拆分,重定向与转发,RequestMapping与其衍生注解,URL 模式匹配,牛逼的传参,设定字符集,返回json数据(序列…

【Hack The Box】linux练习-- seal

HTB 学习笔记 【Hack The Box】linux练习-- seal 🔥系列专栏:Hack The Box 🎉欢迎关注🔎点赞👍收藏⭐️留言📝 📆首发时间:🌴2022年11月17日🌴 &#x1f36d…

②【Maven】从0上手Maven的安装与配置 - 最全教程 (下载 + 配置 + 环境变量 )

个人简介:Java领域新星创作者;阿里云技术博主、星级博主、专家博主;正在Java学习的路上摸爬滚打,记录学习的过程~ 个人主页:.29.的博客 学习社区:进去逛一逛~ Maven >>> 下载、安装、配置一、下载…

jenkins关联github

将Jenkins和github关联起来,实现自动化集成 GitHub侧 1、生成secret.txt secret在github上被称为token 进去GitHub --> Settings --> Developer settings --> Personal access tokens -> Generate new token创建一个新的token,勾选两处标红的地方 点…

Flutter高仿微信-第58篇-扫一扫

Flutter高仿微信系列共59篇,从Flutter客户端、Kotlin客户端、Web服务器、数据库表结构、Xmpp即时通讯服务器、视频通话服务器、腾讯云服务器全面讲解。 详情请查看 效果图: 实现代码: //二维码扫一扫 Future _scanQR() async {try {final re…

外设驱动库开发笔记49:BY25Qxx存储器驱动

在有一些应用中,我们可能需要大一些容量的存储单元,而实现的形式多种多样,在这一篇中我们将来讨论怎么使用BY25QXXX系列NOR FLASH存储器的问题。 1、功能概述 在开始实现BY25QXXX系列NOR FLASH存储器的驱动之前,我们需要先了解一…

Mysql-解决创建存储函数This function has none of DETERMINISTIC

问题 当二进制日志启用后,这个变量就会启用。它控制是否可以信任存储函数创建者,不会创建写入二进制日志引起不安全事件的存储函数。 如果设置为0(默认值),用户不得创建或修改存储函数,除非它们具有除CRE…

COLMAP生成MVSNet数据集

一. colmap2mvsnet.py COLMAP可以给图像数据集标定一套相机外参及视图选择。如果想用COLMAP导出的结果输入MVSNet测试,需要把数据集(图片、相机参数等)转化为MVSNet的输入格式。MVSNet的作者yaoyao在Github上提供了colmap2mvsnet.py代码&…

Java内存区域

目录复制 Java内存区域区域划分内存溢出异常区域划分 Java虚拟机在执行Java程序的过程中会把它所管理的内存划分为若干个不同的数据区域。根据《Java虚拟机规格》的规定,Java虚拟机所管理的内存包括以下几个运行时数据区域。 线程独占的有:程序计数器…