JSONP 跨域访问(1), 简介, 原理, 实验, 缺点
JSONP 跨域访问(1), 简介, 原理, 实验, 缺点
一, JSONP 简介
JSONP（JSON with Padding）是一种非官方跨域数据交互协议。它允许web页面从不同的域名下加载数据。
由于同源策略，web页面通过XMLHttpRequest调用通常只允许访问与其自身相同域名的资源。
JSONP是一种在早期浏览器中绕过这一限制的方法。
<script> 标签天生就拥有跨域请求的能力，这是由浏览器的同源策略所允许的。
这种特性被用于加载来自不同源（域名、协议或端口）的 JavaScript 文件，例如，从 CDN（内容分发网络）加载库或框架。
JSONP（JSON with Padding）正是基于这个能力来实现跨域请求的。通过动态创建一个
二, JSONP 工作原理
1. 客户端发起请求：
客户端通过<script>标签发起一个GET请求。请求的URL包含一个查询参数，通常是callback，它的值是一个将被服务器端调用的函数名。
2. 服务器端响应：
服务器端收到请求后，会将数据封装在一个函数调用中。这个函数就是请求URL中指定的callback参数的值。
3. 客户端处理：
响应返回给客户端后，由于是<script>标签的请求，所以返回的JavaScript代码会立即执行。
此时，客户端已经定义了一个与callback参数值相同名字的函数，因此，这个函数会被调用，并传入解析后的JSON数据作为参数。
4. 完成交互：
客户端的回调函数执行，处理传入的数据。
三, 代码实验
1. 环境准备
192.168.112.200 html页面
192.168.112.202 php脚本
2. 实验目的:
访问200上的html页面, 由html跨域访问202上的php脚本.
3. 实验过程:
(1)在200服务器上准备一个jsonp.html页面:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><script type="text/javascript">// 这里定义你的回调函数function jsonpCallback(data) {// 处理JSON数据的代码console.log(data);}</script> <script type="text/javascript" src="http://192.168.112.202/security/jsonp.php?callback=jsonpCallback"></script>
</head><body></body></html>
这个页面定义了一个回调函数jsonpCallback(), 它用于处理响应的json.
然后通过一个<script>标签向202服务器发送GET请求, 通过callback参数传入函数名.
(2) 在202服务器上准备一个jsonp.php脚本.
<?php
$person = array("name" => "John Doe","age" => "30","occupation" => "Developer"
);
$jsonString = json_encode($person);
echo $_GET['callback'] . "(" . $jsonString . ")";
?>
服务器这段代码生成一个叫做jsonString的json字符串, 返回的数据通过拼接而成, 前面是GET传递过来的参数值$_GET['callback'], 后面是被括号括起来的json数据"(" . $jsonString . ")".
(3) 访问200服务器上的jsonp.html页面:
http://192.168.112.200/jsonp/jsonp.html
上面的url向200服务器发送GET请求访问页面, 传入参数callback=jsonpCallback.
接下来200服务器上的jsonp.php执行, 生成json字符串, $_GET['callback'] 的值由前端传过来是jsonpCallback, 那么最后拼接出来就是:
jsonpCallback({"name": "John Doe", "age": "30", "occupation": "Developer"});
可以看到服务器就是返回了一段js代码, 因为前端是使用<script>标签请求的js, 所以响应返回后, 前端会立刻执行返回的js代码, 而这段代码是调用前端定义的jsonpCallback()函数, 并传入服务器生成的json字符串做进一步处理.
四, JSONP的缺点
现在使用 JSONP 进行跨域请求的情况已经不太常见了。主要原因是它的安全问题和功能限制，尤其是以下几点：
1. 安全性：
JSONP 非常容易受到跨站脚本攻击（XSS）的影响。因为它通过 <script> 标签接收执行代码，如果攻击者可以控制 JSONP 响应，他们可以在用户的浏览器中执行恶意代码。
2. 受限的HTTP方法：
JSONP 只能进行 GET 请求，不能使用 POST、PUT、DELETE 等 HTTP 方法，这在现代应用程序中是一个严重的限制。
3. 缺乏错误处理：
在 JSONP 中，如果请求失败，很难准确地捕捉到错误并进行处理，因为 <script> 标签没有提供标准的错误监听机制。
4. 缺乏直接支持：
JSONP 需要服务器特别支持返回 JSONP 响应，这需要服务器端进行额外的编码工作。
相比之下，CORS（跨源资源共享）是一个 W3C 标准，现代浏览器都支持这个标准。
CORS 允许浏览器向另一个域名的服务器发送XMLHttpRequest或 Fetch API 请求，只要服务器返回正确的 CORS 响应头，就能够实现安全的跨域请求。
因为 CORS 提供了更细粒度的控制，更好的安全性和更全面的HTTP方法支持，所以它已经成为了处理跨域请求的首选方式。
在新的Web应用中，建议使用 CORS 而不是 JSONP。
相关文章：
, 简介, 原理, 实验, 缺点)
JSONP 跨域访问(1), 简介, 原理, 实验, 缺点
JSONP 跨域访问(1), 简介, 原理, 实验, 缺点 一, JSONP 简介 JSONP（JSON with Padding）是一种非官方跨域数据交互协议。它允许web页面从不同的域名下加载数据。 由于同源策略，web页面通过XMLHttpRequest调用通常只允许访问与其自身相同域名…...
velero备份k8s集群
流程图 velero备份原理 本地 Velero 客户端发送备份指令。Kubernetes 集群内就会创建一个 Backup 对象。BackupController 监测 Backup 对象并开始备份过程。BackupController 会向 API Server 查询相关数据。BackupController 将查询到的数据备份到远端的对象存储。 velero的…...
描述低轨星座的特点和通信挑战，以及它们在5G和B5G中的作用。
文章目录 2章4 章5章（没看）6章（没看） 2章 将卫星星座中每个物理链路中可实现的数据速率、传播延迟和多普勒频移与3GPP技术报告中的参数进行分析和比较[3]。 相关配置 面向连接的网络，预先简历链路 卫星和地面终端有…...
Spring Boot实践 --windows环境下 K8s 部署 Docker
第一步：搭建项目并制作合适的jar包 这里我们准备好前面项目 用户管理系统 项目里的jar包。测试功能，定时任务会每过10s打印一次日志： E:\test>java -jar demospringboot-0.0.1-SNAPSHOT.jar2023-11-01 20:24:21.059 INFO 11848 --- [ …...
Linux 将Qt程序打包为AppImage包
前言 在 Linux 环境下，开发完 Qt 程序后，也需要制作为一个安装包或者可执行文件进行分发。这里介绍使用 linuxdeployqt 将 Qt 程序打包为 .AppImage 应用程序（类似于 Windows 的绿色免安装软件） 环境配置 配置 Qt 环境变量 这…...
修复国产电脑麒麟系统开机出现initramfs 问题
目录预览 一、问题描述二、原因分析三、解决方案四、知识点呀initramfsBusyBox 五、参考链接 一、问题描述 国产麒麟系统出现 initramfs 模式 二、原因分析 一般在拷贝卡顿过程【强制关机】或者电【脑异常断电】的情况下概率性导致系统分区损坏，重启后大概率就会进…...
机器人控制算法—如何使用C++读取pgm格式的栅格地图并转化为ROS地图格式的data?
1.Introduction 近期正在做全局规划局部动态规划的项目，目前遇到的问题是，我们如何利用C处理pgm地图文件。即将地图信息要与像素点结合起来。所以我们需要知道地图读取和处理的底层原理，这样更好地在非ROS平台下移植。 2.Main 如下几条信息…...
牛客项目（五）-使用kafka实现发送系统通知
kafka入门以及与spring整合 Message.java import java.util.Date;public class Message {private int id;private int fromId;private int toId;private String conversationId;private String content;private int status;private Date createTime;public int getId() {retur…...
计算机网络——第一章时延部分深入学习、相关习题及详细解析
目录 时延相关 习题1 习题1-改 习题2 时延相关 之前我们学习过，时延由发送时延、传播时延和处理时延三部分构成。 发送时延的计算公式为“分组长度除以发送速率”， 发送速率应该从网卡速率、信道带宽、以及对端的接口速率中取最小。 传播时延的计…...
CSS3媒体查询与页面自适应
2017年9月，W3C发布媒体查询(Media Query Level 4)候选推荐标准规范，它扩展了已经发布的媒体查询的功能。该规范用于CSS的media规则，可以为文档设定特定条件的样式，也可以用于HTML、JavaScript等语言。 1、媒体查询基础 媒体查询…...
UG\NX二次开发 超长的对象属性值，怎么设置
文章作者：里海 来源网站：里海NX二次开发3000例专栏 感谢粉丝订阅 感谢 Dr. Lin 订阅本专栏，非常感谢。 简介 使用UF_ATTR_assign设置对象属性，如果属性值超过UF_ATTR_MAX_STRING_LEN则会报错。 #define UF_ATTR_MAX_STRING_LEN 132 怎么办呢？下面这种方法可以解决： 效果 …...
流媒体服务实现H5实时预览视频
目录 背景方案业务实践细节注意 待办 背景 客户aws服务磁盘存储告急，最高可扩容16T。排查如下：主要是视频文件存在大量复制使用的情况。例如发布节目时复制、预览时复制，这样上传一份视频后最大会有四份拷贝（预览、普通发布、互动…...
C++适配器
文章目录 引言栈和队列 priority_queue仿函数迭代器区间 引言 栈的特性是先进后出，队列的特性是先进先出，然而双向队列同时具有栈和队列的特性，所以我们可以通过双向队列来适配出栈和队列。 先看库里面 栈和队列 stack和queue模板参数里面都…...
基于openresty waf二次开发多次匹配到的ip再做拉黑
我们想在openresty waf的基础上做二次开发，比如再精确一些。比如我们先匹配到了select的url我们先打分10分，匹配到cc 1000/s我们再给这个ip打10分…直到100分我们就拉黑这个ip。 [openresty waf][1] #cat reids_w.lua require lib local redis require…...
新一代构建工具Vite-xyphf
一、什么vite? vite:是一款思维比较前卫而且先进的构建工具,他解决了一些webpack解决不了的问题——在开发环境下可以实现按需编译，加快了开发速度。而在生产环境下，它使用Rollup进行打包，提供更好的tree-shaking、代码压缩和性能优化&…...
Flink源码解析三之执行计划⽣成
JobManager Leader 选举 首先flink会依据配置获取RecoveryMode,RecoveryMode一共两两种:STANDALONE和ZOOKEEPER。 如果用户配置的是STANDALONE,会直接去配置中获取JobManager的地址如果用户配置的是ZOOKEEPER,flink会首先尝试连接zookeeper,利用zookeeper的leadder选举服务发现…...
Flutter 常见错误记录总结
1、当 flutter pub get 指令报如下错误时： pub get failed command: "/Users/***/developer/flutter/bin/cache/dart-sdk/bin/dart __deprecated_pub --color --directory . get --example" pub env: { "FLUTTER_ROOT": "/Users/***/dev…...
[ASP]校无忧在线报名系统 v2.1
校无忧在线报名系统为了满足各地不同的报名人员的需求，为提供更为高效、方便、快捷的报名条件，同时也为减轻管理人员的工作难度；更为协调报名人员与管理人员的关系，快速提高了报名人员与管理人员的工作效率应运而生。系统适用于政…...
【Hydro】部分基流分割方法及程序代码说明
目录 说明一、数字滤波法单参数数字滤波Lyne-Hollick滤波法Chapman滤波法Chapman-Maxwell滤波法Boughton-Chapman滤波法 双参数滤波法Eckhardt滤波法 二、其他基流分割方法基流指数（BFI）法时间步长（HYSEP）法PART法加里宁-阿里巴扬…...
C#Regex正则表达式（Regular Expression）
在C#中，Regex是正则表达式（Regular Expression）的缩写，它是一种强大的文本匹配和处理工具。正则表达式是一种用于描述模式的字符串，它可以用来在文本中查找、替换和提取满足特定模式的内容。 在C#中，你可以…...
VB.net复制Ntag213卡写入UID
本示例使用的发卡器：https://item.taobao.com/item.htm?ftt&id615391857885 一、读取旧Ntag卡的UID和数据 Private Sub Button15_Click(sender As Object, e As EventArgs) Handles Button15.Click轻松读卡技术支持:网站:Dim i, j As IntegerDim cardidhex, …...
从WWDC看苹果产品发展的规律
WWDC 是苹果公司一年一度面向全球开发者的盛会，其主题演讲展现了苹果在产品设计、技术路线、用户体验和生态系统构建上的核心理念与演进脉络。我们借助 ChatGPT Deep Research 工具，对过去十年 WWDC 主题演讲内容进行了系统化分析，形成了这份…...
Spring Boot+Neo4j知识图谱实战：3步搭建智能关系网络！
一、引言 在数据驱动的背景下，知识图谱凭借其高效的信息组织能力，正逐步成为各行业应用的关键技术。本文聚焦 Spring Boot与Neo4j图数据库的技术结合，探讨知识图谱开发的实现细节，帮助读者掌握该技术栈在实际项目中的落地方法。 …...
Spring Cloud Gateway 中自定义验证码接口返回 404 的排查与解决
Spring Cloud Gateway 中自定义验证码接口返回 404 的排查与解决 问题背景 在一个基于 Spring Cloud Gateway WebFlux 构建的微服务项目中，新增了一个本地验证码接口 /code，使用函数式路由（RouterFunction）和 Hutool 的 Circle…...
Linux C语言网络编程详细入门教程：如何一步步实现TCP服务端与客户端通信
文章目录 Linux C语言网络编程详细入门教程：如何一步步实现TCP服务端与客户端通信前言一、网络通信基础概念二、服务端与客户端的完整流程图解三、每一步的详细讲解和代码示例1. 创建Socket（服务端和客户端都要）2. 绑定本地地址和端口&#x…...
C++使用 new 来创建动态数组
问题： 不能使用变量定义数组大小 原因： 这是因为数组在内存中是连续存储的，编译器需要在编译阶段就确定数组的大小，以便正确地分配内存空间。如果允许使用变量来定义数组的大小，那么编译器就无法在编译时确定数组的大…...
Java求职者面试指南：Spring、Spring Boot、MyBatis框架与计算机基础问题解析
Java求职者面试指南：Spring、Spring Boot、MyBatis框架与计算机基础问题解析 一、第一轮提问（基础概念问题） 1. 请解释Spring框架的核心容器是什么？它在Spring中起到什么作用？ Spring框架的核心容器是IoC容器&#…...
解决：Android studio 编译后报错\app\src\main\cpp\CMakeLists.txt‘ to exist
现象： android studio报错： [CXX1409] D:\GitLab\xxxxx\app.cxx\Debug\3f3w4y1i\arm64-v8a\android_gradle_build.json : expected buildFiles file ‘D:\GitLab\xxxxx\app\src\main\cpp\CMakeLists.txt’ to exist 解决： 不要动CMakeLists.…...
ubuntu22.04有线网络无法连接，图标也没了
今天突然无法有线网络无法连接任何设备，并且图标都没了 错误案例 往上一顿搜索，试了很多博客都不行，比如 Ubuntu22.04右上角网络图标消失 最后解决的办法 下载网卡驱动，重新安装 操作步骤 查看自己网卡的型号 lspci | gre…...
Sklearn 机器学习 缺失值处理 获取填充失值的统计值
💖亲爱的技术爱好者们，热烈欢迎来到 Kant2048 的博客！我是 Thomas Kant，很开心能在CSDN上与你们相遇～💖 本博客的精华专栏： 【自动化测试】 【测试经验】 【人工智能】 【Python】 使用 Scikit-learn 处理缺失值并提取填充统计信息的完整指南 在机器学习项目中，数据清…...