当前位置： 首页 > news >正文

JSONP跨域

news 2026/1/19 5:56:44

1 概述

定义

json存在的意义：

不同类型的语言，都能识别json

JSONP(JSON with Padding)是JSON的一种“使用模式”，可用于解决主流浏览器的跨域数据访问的问题。由于同源策略，一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通，而 HTML 的

image-20240731100716457

  • 跨域：浏览器A从服务器B获取的静态资源，包括Html、Css、Js，然后在Js中通过Ajax访问C服务器的静态资源或请求。即：浏览器A从B服务器拿的资源，资源中想访问服务器C的资源。
  • 同源策略：同一个请求协议(如：Http或Https)、同一个Ip、同一个端口，3个全部相同，即为同源。

2 demo

后端

<?php$arr=["name"=>"woniu","age"=>20];//把数组转成json字符串,$json = json_encode($arr);//输出echo $json;
?>

前端

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="./jquery-3.4.1.min.js"></script>
</head>
<body><h1>前端</h1><script>$.getJSON("后端的地址",function(data){alert(JSON.stringify(data));})</script>
</body>
</html>

用户访问

192.168.190.134/woniu/demo31.html

查看控制台：

image-20240731102921872

解决方案

  • JSONP
  • CORS

3 JSONP

image-20240731105929545

image-20240731112347075

后端

<?php$arr=["name"=>"woniu","age"=>20];//把数组转成json字符串,$json = json_encode($arr);$callback = $_GET["callback"]; // 函数对象, 字符串//输出///echo $json;echo "$callback('$json')";
?>

前端

# 方法一：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="./jquery-3.7.1.min.js"></script>
</head>
<body><h1>前端</h1><script>// function xxx(data){//     // 后端返回的data json//     console.log("999");// }</script><script>$.getJSON("http://192.168.190.133/wh069/demo31.php?callback=?",function(data){alert(JSON.stringify(data));// alert(JSON.parse(data));  // 反序列化 // json：序列化和反序列化})</script>
</body>
</html># 方法二：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="./jquery-3.7.1.min.js"></script>
</head>
<body><h1>前端</h1><script>function xxx(data){// 后端返回的data jsonalert(JSON.stringify(data));}</script><script src="http://192.168.190.133/wh069/demo31.php?callback=xxx"></script>
</body>
</html>

相关文章：

JSONP跨域

1 概述 定义 json存在的意义&#xff1a; 不同类型的语言&#xff0c;都能识别json JSONP(JSON with Padding)是JSON的一种“使用模式”&#xff0c;可用于解决主流浏览器的跨域数据访问的问题。由于同源策略&#xff0c;一般来说位于 server1.example.com 的网页无法与不是 s…...

编程日记 2024/8/7 23:14:47

Linux--shell脚本语言—/—终章

一、shell函数 1、shell函数定义格式 参数说明&#xff1a; 1、可以带function fun() 定义&#xff0c;也可以直接fun() 定义,不带任何参数。 2、参数返回&#xff0c;可以显示加&#xff1a;return 返回&#xff0c;如果不加&#xff0c;将以最后一条命令运行结果&#xff…...

编程日记 2024/8/7 23:12:45

免费代理池是什么，如何使用代理IP进行网络爬虫？

互联网是一个庞大的数据集合体&#xff0c;网络信息资源丰富且繁杂&#xff0c;想要从中找到自己需要的信息要花费较多的时间。为了解决这个问题&#xff0c;网络爬虫技术应运而生&#xff0c;它的主要作用就是在海量的互联网信息中进行爬取&#xff0c;抓取有效信息并存储。然…...

编程日记 2024/8/7 23:11:44

CAN直接网络管理(20240805)

长安CAN网络管理规范 个人理解&#xff1a;管理CAN网络中各NM节点的工作模式&#xff08;状态&#xff09;&#xff1b; 1.术语定义 &#x1f449;节点地址&#xff1a;用于唯一标识网络中每个节点的单字节数字&#xff0c;取值范围是 0x00~0xFF。&#x1f449;状态迁移&#x…...

编程日记 2024/8/7 23:10:44

HTML5+CSS3笔记（Xmind格式）：第二天

Xmind鸟瞰图&#xff1a; 简单文字总结&#xff1a; 新增选择器&#xff1a; 1.选择相邻兄弟 2.属性选择器 3.结构性伪类选择器 4.整体结构类型 5.标签结构类型 6.指定子元素的序号 7.文本选择伪元素 8.表单中使用的状态伪类选择器 9.内容…...

编程日记 2024/8/7 23:08:42

视频压缩文件太大了怎么缩小？6个视频压缩技巧，速度收藏起来！

高清视频文件&#xff0c;尤其是那些以 1080p 和 720p 清晰度为特征的视频&#xff0c;通常都拥有相当大的体积&#xff0c;会占据大量计算机存储空间。因此&#xff0c;为了更好地将它们进行分享和存储&#xff0c;您可能需要对它们进行压缩&#xff0c;以减小它们的尺寸。然而…...

编程日记 2024/8/7 23:07:40

Python接口自动化测试数据提取分析：Jmespath

1、引言 在处理JSON数据时&#xff0c;我们常常需要提取、筛选或者变换数据。手动编写这些操作的代码不仅繁琐&#xff0c;而且容易出错。Python作为一个功能强大的编程语言&#xff0c;拥有丰富的库和工具来处理这些数据。今天&#xff0c;将介绍一个实用的Python库——JMESP…...

编程日记 2024/8/7 23:06:39

特种设备作业叉车司机题库及答案

1.在我们平时工作中&#xff0c;经常接触的汽油、柴油、机油、油棉纱、木材等均为() A、助燃物质 B、可燃物质 C、着火源 参考答案:B 2.叉车满载行驶时&#xff0c;如合成重心靠后() A、有利于纵向稳定 B、有利于横向稳定 C、纵向和横向均有利 参考答案:A 3.蓄电池车行驶中放…...

编程日记 2024/8/7 23:05:38

Linux 操作系统速通

一、安装虚拟机 1. VmWare 安装下载 vmware workstation pro 16 下载 win R 输入 ncpa.cpl 确保网卡正常 2. CentOS 系统下载 CentOS 系统下载 将 CentOS 系统安装到虚拟机 3. 查看虚拟机 IP 命令 ifconfig 4. finalShell 安装下载 finalShell 下载 输入用户名一般是 ro…...

编程日记 2024/8/7 23:04:37

IIS漏洞大全（附修复方法）

IIS6.0 IlS Server 在 Web 服务扩展中开启了 WebDAV&#xff0c;配置了可以写入的权限&#xff0c;造成任意文件上传。 漏洞复现 fofa:"llS-6.0" or 本地搭建2003 server 1)开启 WebDAV 和写权限: 做好准备工作后开启环境&#xff0c;然后我们去访问配置的IP&#…...

编程日记 2024/8/7 23:03:36

HarmonyOS笔记3：从网络数据接口API获取数据

面向HarmonyOS的移动应用一般采用MVVM模式&#xff08;见参考文献【1】&#xff09;&#xff0c;其中&#xff1a; M&#xff08;Model层)&#xff1a;模型层&#xff0c;存储数据和相关逻辑的模型。它表示组件或其他相关业务逻辑之间传输的数据。Model是对原始数据的进一步处理…...

编程日记 2024/8/7 23:01:34

Mac 下生成core dump

mac下生成core dump 使用ulimit -c查看ulimit设置,显示unlimited表示开启,显示0表示关闭,通过ulimit -c unlimited打开设置; 但是这个只在当前窗口有效果。如果需要变成系统全局设置。 就需要去改/etc/profile文件&#xff0c;打开&#xff0c;然后加上ulimit -c unlimited就可…...

编程日记 2024/8/7 23:00:33

详解Xilinx FPGA高速串行收发器GTX/GTP（1）--SerDes和GTX的关系

目录 1、SerDes和GTX的关系 2、传输总线的变化 2.1、从串行到并行 2.2、从并行又回到串行 文章总目录点这里：《FPGA接口与协议》专栏的说明与导航 1、SerDes和GTX的关系 Hold On，这个系列文章不是讲GTX收发器的吗？怎么一开始就扯到SerDes上了？GTX和SerDes之间有…...

编程日记 2024/8/7 22:55:28

golang实现Digest认证鉴权接口

什么是Digest认证鉴权接口？ Digest认证鉴权接口是一种基于摘要算法的身份验证方法，用于确保API请求的安全性。在实际应用中，常常使用HTTP协议的Digest认证鉴权接口来验证请求的合法性。下面是一种常见的Digest认证鉴权流程： 1. 客户端发送HTTP请求到服务器，请求接口资源…...

编程日记 2024/8/7 22:53:27

机房托管服务器说明

机房托管服务器是指将企业或个人的服务器放置到专业数据中心(IDC机房)进行管理和维护&#xff0c;由数据中心提供稳定、安全的运行环境以及网络连接等基础设施支持。rak小编为您整理发布机房托管服务器说明详细内容。 通过托管服务器到专业机房&#xff0c;企业能够享受到高性能…...

编程日记 2024/8/7 22:52:26

CookieMaker工作室合作开发C++项目十一：拟态病毒

&#xff08;注&#xff1a;本文章使用了“无标题技术”&#xff09; 一天&#xff0c;我和几个同事&#xff0c;平台出了点BUG&#xff0c;居然给我刷出了千年杀&#xff0c;同事看得瑕疵欲裂&#xff0c;发誓要将我挫骨扬灰—— &#xff08;游戏入口&#xff1a;和平精英31.…...

编程日记 2024/8/7 22:51:25

57、PHP 实现 从扑克牌中随机抽取5张牌，判断是不是一个顺子

题目&#xff1a; PHP 实现 从扑克牌中随机抽取5张牌&#xff0c;判断是不是一个顺子 描述&#xff1a; 即这5张牌是不是连续的2-10位数字本身&#xff0c;A为1&#xff0c;J为11&#xff0c;Q为12&#xff0c;K为13&#xff0c;而大小王可以看成任意数字。 解题思路&#xf…...

编程日记 2024/8/7 22:48:22

前端HTML+CSS查漏补缺——仿制百度搜索首页的一些思考

在像素模仿百度搜索首页的时候&#xff0c;在实现的时候&#xff0c;遇到了一些值得记录的点。 在这个过程中&#xff0c;也顺便看了看百度的源码&#xff0c;感觉很有意思。 对了&#xff0c;QQ截屏里面获取到的颜色&#xff0c;是不大正确的&#xff0c;会有点误差。 这是我…...

编程日记 2024/8/7 22:46:20

【Python】实现一个个人理财助手小程序

以下是一个简化的 Python 代码框架&#xff0c;以及如何实现上述功能点的基本思路&#xff0c;可以基于这个框架进一步开发和完善你的小程序。 以下是一个简化的 Python 代码框架&#xff0c;使用了基本的类和函数来模拟上述功能&#xff1a; import pandas as pd from crypt…...

编程日记 2024/8/7 22:45:19

【GCC】结合GPT4 延迟梯度学习2：延迟梯度的计算及阈值更新

上文，充分发现了 排队梯度延迟的重要性， 【GCC】结合GPT4 延迟梯度学习1：公式推导及理论分析 例如： 延迟梯度为正数时，是单位时间内的排队队列长度的“增长速度” 延迟梯度与 发送速率（接收速率？）有直接的关系。 因为有 观测误差、随机因素、噪声，所以要对延迟梯度进行…...

编程日记 2024/8/7 22:43:17

KubeSphere 容器平台高可用：环境搭建与可视化操作指南

Linux_k8s篇 欢迎来到Linux的世界&#xff0c;看笔记好好学多敲多打&#xff0c;每个人都是大神&#xff01; 题目&#xff1a;KubeSphere 容器平台高可用&#xff1a;环境搭建与可视化操作指南 版本号: 1.0,0 作者: 老王要学习 日期: 2025.06.05 适用环境: Ubuntu22 文档说…...

编程新知 2026/1/18 23:31:43

【Axure高保真原型】引导弹窗

今天和大家中分享引导弹窗的原型模板&#xff0c;载入页面后&#xff0c;会显示引导弹窗&#xff0c;适用于引导用户使用页面&#xff0c;点击完成后&#xff0c;会显示下一个引导弹窗&#xff0c;直至最后一个引导弹窗完成后进入首页。具体效果可以点击下方视频观看或打开下方…...

编程新知 2026/1/18 20:26:38

C++实现分布式网络通信框架RPC(3)--rpc调用端

目录 一、前言 二、UserServiceRpc_Stub 三、 CallMethod方法的重写 头文件 实现 四、rpc调用端的调用 实现 五、 google::protobuf::RpcController *controller 头文件 实现 六、总结 一、前言 在前边的文章中&#xff0c;我们已经大致实现了rpc服务端的各项功能代…...

编程新知 2026/1/18 18:05:23

【杂谈】-递归进化：人工智能的自我改进与监管挑战

递归进化&#xff1a;人工智能的自我改进与监管挑战 文章目录 递归进化&#xff1a;人工智能的自我改进与监管挑战1、自我改进型人工智能的崛起2、人工智能如何挑战人类监管&#xff1f;3、确保人工智能受控的策略4、人类在人工智能发展中的角色5、平衡自主性与控制力6、总结与…...

编程新知 2025/12/9 0:22:01

进程地址空间（比特课总结）

一、进程地址空间 1. 环境变量 1 &#xff09;⽤户级环境变量与系统级环境变量 全局属性&#xff1a;环境变量具有全局属性&#xff0c;会被⼦进程继承。例如当bash启动⼦进程时&#xff0c;环 境变量会⾃动传递给⼦进程。 本地变量限制&#xff1a;本地变量只在当前进程(ba…...

编程新知 2025/11/15 6:48:52

如何在看板中有效管理突发紧急任务

在看板中有效管理突发紧急任务需要&#xff1a;设立专门的紧急任务通道、重新调整任务优先级、保持适度的WIP&#xff08;Work-in-Progress&#xff09;弹性、优化任务处理流程、提高团队应对突发情况的敏捷性。其中&#xff0c;设立专门的紧急任务通道尤为重要&#xff0c;这能…...

编程新知 2026/1/15 11:07:08

Qt Http Server模块功能及架构

Qt Http Server 是 Qt 6.0 中引入的一个新模块&#xff0c;它提供了一个轻量级的 HTTP 服务器实现&#xff0c;主要用于构建基于 HTTP 的应用程序和服务。 功能介绍&#xff1a; 主要功能 HTTP服务器功能&#xff1a; 支持 HTTP/1.1 协议 简单的请求/响应处理模型 支持 GET…...

编程新知 2025/10/17 21:16:57

【C语言练习】080. 使用C语言实现简单的数据库操作

080. 使用C语言实现简单的数据库操作 080. 使用C语言实现简单的数据库操作使用原生APIODBC接口第三方库ORM框架文件模拟1. 安装SQLite2. 示例代码：使用SQLite创建数据库、表和插入数据3. 编译和运行4. 示例运行输出：5. 注意事项6. 总结080. 使用C语言实现简单的数据库操作 在…...

编程新知 2025/9/22 21:37:01

前端开发面试题总结-JavaScript篇(一)

文章目录 JavaScript高频问答一、作用域与闭包1.什么是闭包&#xff08;Closure&#xff09;&#xff1f;闭包有什么应用场景和潜在问题&#xff1f;2.解释 JavaScript 的作用域链&#xff08;Scope Chain&#xff09; 二、原型与继承3.原型链是什么&#xff1f;如何实现继承&a…...

编程新知 2026/1/14 17:29:22

【C++从零实现Json-Rpc框架】第六弹 —— 服务端模块划分

一、项目背景回顾 前五弹完成了Json-Rpc协议解析、请求处理、客户端调用等基础模块搭建。 本弹重点聚焦于服务端的模块划分与架构设计&#xff0c;提升代码结构的可维护性与扩展性。 二、服务端模块设计目标 高内聚低耦合&#xff1a;各模块职责清晰&#xff0c;便于独立开发…...

编程新知 2025/10/13 4:15:41