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#中，你可以…...
MPNet：旋转机械轻量化故障诊断模型详解python代码复现
目录 一、问题背景与挑战 二、MPNet核心架构 2.1 多分支特征融合模块（MBFM） 2.2 残差注意力金字塔模块（RAPM） 2.2.1 空间金字塔注意力（SPA） 2.2.2 金字塔残差块（PRBlock） 2.3 分类器设计 三、关键技术突破 3.1 多尺度特征融合 3.2 轻量化设计策略 3.3 抗噪声…...
理解 MCP 工作流：使用 Ollama 和 LangChain 构建本地 MCP 客户端
🌟 什么是 MCP？ 模型控制协议 (MCP) 是一种创新的协议，旨在无缝连接 AI 模型与应用程序。 MCP 是一个开源协议，它标准化了我们的 LLM 应用程序连接所需工具和数据源并与之协作的方式。 可以把它想象成你的 AI 模型 和想要使用它…...
Qt Http Server模块功能及架构
Qt Http Server 是 Qt 6.0 中引入的一个新模块，它提供了一个轻量级的 HTTP 服务器实现，主要用于构建基于 HTTP 的应用程序和服务。 功能介绍： 主要功能 HTTP服务器功能： 支持 HTTP/1.1 协议 简单的请求/响应处理模型 支持 GET…...
C++八股 —— 单例模式
文章目录 1. 基本概念2. 设计要点3. 实现方式4. 详解懒汉模式 1. 基本概念 线程安全（Thread Safety） 线程安全是指在多线程环境下，某个函数、类或代码片段能够被多个线程同时调用时，仍能保证数据的一致性和逻辑的正确性…...
docker 部署发现spring.profiles.active 问题
报错： org.springframework.boot.context.config.InvalidConfigDataPropertyException: Property spring.profiles.active imported from location class path resource [application-test.yml] is invalid in a profile specific resource [origin: class path re…...
10-Oracle 23 ai Vector Search 概述和参数
一、Oracle AI Vector Search 概述 企业和个人都在尝试各种AI，使用客户端或是内部自己搭建集成大模型的终端，加速与大型语言模型（LLM）的结合，同时使用检索增强生成（Retrieval Augmented Generation &#…...
C++ 设计模式 《小明的奶茶加料风波》
👨🎓 模式名称：装饰器模式（Decorator Pattern） 👦 小明最近上线了校园奶茶配送功能，业务火爆，大家都在加料： 有的同学要加波霸 🟤，有的要加椰果…...
保姆级【快数学会Android端“动画“】+ 实现补间动画和逐帧动画！！！
目录 补间动画 1.创建资源文件夹 2.设置文件夹类型 3.创建.xml文件 4.样式设计 5.动画设置 6.动画的实现 内容拓展 7.在原基础上继续添加.xml文件 8.xml代码编写 (1)rotate_anim (2)scale_anim (3)translate_anim 9.MainActivity.java代码汇总 10.效果展示 逐帧…...
FOPLP vs CoWoS
以下是 FOPLP（Fan-out panel-level packaging 扇出型面板级封装）与 CoWoS（Chip on Wafer on Substrate）两种先进封装技术的详细对比分析，涵盖技术原理、性能、成本、应用场景及市场趋势等维度： 一、技术原…...
网页端 js 读取发票里的二维码信息（图片和PDF格式）
起因 为了实现在报销流程中，发票不能重用的限制，发票上传后，希望能读出发票号，并记录发票号已用，下次不再可用于报销。 基于上面的需求，研究了OCR 的方式和读PDF的方式，实际是可行的ÿ…...