php+JavaScript实现callback跨域请求jsonp数据
摘要
JSONP 是 JSON with Padding 的缩写,是一种解决跨域数据获取的方案。由于浏览器的同源策略限制,不同域名之间的前端JS代码不能相互访问到对方的数据,JSONP通过script标签的特性,实现在不同域名的网页间传递数据。
其原理是在客户端页面上定义一个回调函数 (callback),然后通过script标签向外部服务器请求数据,并将定义好的回调函数名称作为参数放在url请求地址里,服务器成功接收请求后,使用该参数将数据传递给定义好的回调函数并返回,客户端页面中定义好的回调函数接收参数后进行处理。
正常的AJAX请求
$.ajax({url: "https://qq.com/getdata/",success: function(res) {console.log(res)}
});
如果跨域请求,浏览器会报错:
跨域:例如你访问页面的域名是 https://baidu.com/getdata/,但是ajax请求的是 https://qq.com/getdata/ ,虽然都是getdata,但是其域名不一样,浏览器会拒绝请求。

这样的情况下,你通过ajax是无法获得请求数据的。
如何解决这个问题?jsonp就可以解决。
JSONP数据源代码示例
数据源即ajax请求的接口,其返回的是由括号括起来的json数据。服务端需要根据请求中的回调函数名称callback,将用户数据包装在函数调用中。
假设是:https://www.qq.com/callbackData/index.php
<?php// 页面编码header("Content-type:application/json");// 数据源$data = array(array('title' => '90后考上公职3个月开始贪污获刑3年','url' => 'https://baijiahao.baidu.com/s?id=1780086209787359686'),array('title' => '男子闪婚后闪离 24万彩礼要回8万','url' => 'http://dzb.hxnews.com/news/kx/202310/19/2138573.shtml'),array('title' => '神舟十七号船箭组合体转运至发射区','url' => 'https://baijiahao.baidu.com/s?id=1780150004201916038&wfr=spider&for=pc'),array('title' => '以色列要求本国公民立即离开土耳其','url' => 'https://baijiahao.baidu.com/s?id=1780107306390790504&wfr=spider&for=pc'),array('title' => '好莱坞将翻拍《你好李焕英》','url' => 'https://baijiahao.baidu.com/s?id=1780164746410232029&wfr=spider&for=pc'));// 返回结果$result = array('datalist' => $data,'code' => 200,'msg' => '获取成功');// 输出callback$resultCallback = json_encode($result);echo $_GET['callback'] . "(" . $resultCallback . ")";?>
ajax请求
<html><head><title>jsonp请求示例</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0,viewport-fit=cover"><script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.min.js"></script></head><body><div id="app"></div><script>$.ajax({url: "https://www.qq.com/callbackData/index.php",dataType: "jsonp",jsonpCallback: "handleJSONPResponse",success: function(res) {console.log(res)}});</script></body>
</html>
结果:

通过 dataType: "jsonp" 就可以成功请求到数据。
作者
TANKING
相关文章:
php+JavaScript实现callback跨域请求jsonp数据
摘要 JSONP 是 JSON with Padding 的缩写,是一种解决跨域数据获取的方案。由于浏览器的同源策略限制,不同域名之间的前端JS代码不能相互访问到对方的数据,JSONP通过script标签的特性,实现在不同域名的网页间传递数据。 其原理是…...
荣电集团与钕希科技签署全面战略合作
10月26日,荣电集团(以下简称荣电)与钕希科技南京有限公司(以下简称钕希科技)今天在合肥市签署全面战略合作协议,联合进军混合现实(Mixed Reality,以下简称MR)空间计算高科…...
C语言_文件_进程_进程间通讯 常用函数/命令 + 实例
文件相关命令: ps -aux|grep init? //搜索包含init名称的进程 top //linux下的资源管理器(动态)//open 返回的int 是给后面的读/写/光标移动 用的fd,没有open就不能进行后面的操作; int op…...
力扣第406题 根据身高重建队列 c++ 贪心思维
题目 406. 根据身高重建队列 中等 相关标签 贪心 树状数组 线段树 数组 排序 假设有打乱顺序的一群人站成一个队列,数组 people 表示队列中一些人的属性(不一定按顺序)。每个 people[i] [hi, ki] 表示第 i 个人的身高为 hi &am…...
postgresSQL 数据库本地创建表空间读取本地备份SQL文件
使用pgAdmin4,你安装PG得文件夹****/16/paAdmin 4 /runtime/pgAdmin4.exe 第一步:找到Tablespaces 第二步:创建表空间名称 第三步:指向数据文件 第四步:找到Databases,创建表空间 第五步:输入数…...
贝锐花生壳内网穿透推出全新功能,远程业务连接更安全
贝锐旗下内网穿透兼动态域名解析品牌花生壳目前推出了全新的“访问控制”功能,可精确设置访问权限,充分保障信息安全,满足更多用户安全远程访问内网服务的需求。 通过这一功能,可实现指定时间、IP、地区等条件下才能远程访问映射的…...
NIO和BIO编程
一、网络通信编程基本常识 1、什么是Socket? Socket是应用层与TCP/IP协议族通信的中间软件抽象层,它是一组接口,一般由操作系统提供。 2、短连接 短连接是指socket建立连接之后传输数据确定接收完后关闭连接 3、长连接 长连接是指建立so…...
嵌入式系统设计师考试笔记之操作系统基础复习笔记二
目录 3、任务管理 (1)嵌入式操作系统的任务管理可以分为 (2)进程 (3)线程 (4)任务 (5)任务的创建与中止 (6)任务的状态任务有三…...
读图数据库实战笔记01_初识图
1. 图论 1.1. 起源于莱昂哈德欧拉在1736年发表的一篇关于“哥尼斯堡七桥问题”的论文 1.2. 要解决这个问题,该图需要零个或两个具有奇数连接的节点 1.3. 任何满足这一条件的图都被称为欧拉图 1.4. 如果路径只访问每条边一次,则该图具有欧拉路径 1.5…...
K-Means和KNN
主要区别 从无序 —> 有序 从K-Means —> KNN KNN:监督学习,类别是已知的,对已知分类的数据进行训练和学习,找到不同类的特征,再对未分类的数据进行分类。K-Means:无监督学习,事先不知道…...
【Python】【Flask】flask_login的初始化
【背景】 想要更高效地用现有的Flask_login包来实现用户管理方面的常用功能会话管理等。不想再手搓了。 【要点】 首先引入flask_login from flask_login import LoginManager, login_user, login_required, logout_user,current_user然后进行app级别的设置和初始化 login…...
Spring Cloud之API网关(Gateway)
目录 API网关 好处 解决方案 Gateway 简介 特征 核心概念 Route(路由) Predicate(断言) Filter(过滤器) 工作流程 Route(路由) 路由配置方式 1.yml配置文件路由 2.bean进行配置 3.动态路由 动态路由 Predicate(断言) 特点 常见断言 示例 Filter(过滤器) …...
nodejs+vue 电子书阅读系统
本文首先介绍了电子书阅读系统的发展背景与发展现状,然后遵循软件常规开发流程,首先针对系统选取适用的语言和开发平台,随着网络技术的不断发展,多媒体技术应用渐渐的出现在教育领域中,电子书阅读已经成为社会的一个热…...
百度文心一言4.0抢先体验教程!
🍁 展望:关注我, AI学习之旅上,我与您一同成长! 一、 引言 想快速体验文心一言4.0,但又觉得技术难度太高?别担心,我来手把手教你! 🚀 10月17日,文心一言4.0…...
单目3D目标检测 方法综述——直接回归方法、基于深度信息方法、基于点云信息方法
本文综合整理单目3D目标检测的方法模型,包括:基于几何约束的直接回归方法,基于深度信息的方法,基于点云信息的方法。万字长文,慢慢阅读~ 直接回归方法 涉及到模型包括:MonoCon、MonoDLE、MonoFlex、CUPNet…...
oracle,CLOB转XML内存不足,ORA-27163: out of memory ORA-06512: at “SYS.XMLTYPE“,
通过kettle采集数据时,表输入的组件,查询报错。 ORA-27163: out of memory ORA-06512: at “SYS.XMLTYPE”, line 272 ORA-06512: at line 1 通过 ALTER SESSION SET EVENTS ‘31156 trace name context forever, level 0x400’; 修改会话配置 或直接修改…...
PHP与mysql数据库交互
PHP与mysql数据库交互 文章目录 PHP与mysql数据库交互方法速查建立与Mysql链接捕获连接错误SQL语句的执行SQL 错误SQL语句执行结果集对象方法速查 案例 方法速查 函数名 作用 mysqli_connect() 与MySQL 数据库建立连接。 mysqli_close() 关闭与MYSQL 数据库建…...
【广州华锐视点】VR飞行员驾驶模拟实训系统
VR飞行员驾驶模拟实训系统是一种基于虚拟现实技术的航空装备仿真测试技术,可以用于飞行员、乘务员和机务人员的训练。该系统可以模拟真实的飞行环境,包括天气、地形、飞机性能等,使被试者能够在虚拟环境中进行飞行操作,从而提高其…...
太烂的牌也要打完只为自己也不是为了其他什么原因。
day17_io02 1.上课代码敲一遍 2.读取一个文件,这个文件中有随机的一些数字字符,统计这些数字有几个偶数,几个奇数,并且追加写入到该文件末尾。 例如: a.txt文件: 3241256364789629090126581212515 奇数&…...
SDL窗口创建以及简单显示(1)
项目创建步骤 1. 使用Qt Creator创建一个C项目 2. 将SDL库文件放到源文件目录下 在项目pro文件中添加库文件 win32{INCLUDEPATH $$PWD/SDL2-2.0.10/includeLIBS $$PWD/SDL2-2.0.10/lib/x86/SDL2.lib } 使用SDL创建一个窗口 #include <stdio.h>#include <SDL.h>…...
高危文件识别的常用算法:原理、应用与企业场景
高危文件识别的常用算法:原理、应用与企业场景 高危文件识别旨在检测可能导致安全威胁的文件,如包含恶意代码、敏感数据或欺诈内容的文档,在企业协同办公环境中(如Teams、Google Workspace)尤为重要。结合大模型技术&…...
leetcodeSQL解题:3564. 季节性销售分析
leetcodeSQL解题:3564. 季节性销售分析 题目: 表:sales ---------------------- | Column Name | Type | ---------------------- | sale_id | int | | product_id | int | | sale_date | date | | quantity | int | | price | decimal | -…...
涂鸦T5AI手搓语音、emoji、otto机器人从入门到实战
“🤖手搓TuyaAI语音指令 😍秒变表情包大师,让萌系Otto机器人🔥玩出智能新花样!开整!” 🤖 Otto机器人 → 直接点明主体 手搓TuyaAI语音 → 强调 自主编程/自定义 语音控制(TuyaAI…...
python报错No module named ‘tensorflow.keras‘
是由于不同版本的tensorflow下的keras所在的路径不同,结合所安装的tensorflow的目录结构修改from语句即可。 原语句: from tensorflow.keras.layers import Conv1D, MaxPooling1D, LSTM, Dense 修改后: from tensorflow.python.keras.lay…...
Go语言多线程问题
打印零与奇偶数(leetcode 1116) 方法1:使用互斥锁和条件变量 package mainimport ("fmt""sync" )type ZeroEvenOdd struct {n intzeroMutex sync.MutexevenMutex sync.MutexoddMutex sync.Mutexcurrent int…...
【LeetCode】3309. 连接二进制表示可形成的最大数值(递归|回溯|位运算)
LeetCode 3309. 连接二进制表示可形成的最大数值(中等) 题目描述解题思路Java代码 题目描述 题目链接:LeetCode 3309. 连接二进制表示可形成的最大数值(中等) 给你一个长度为 3 的整数数组 nums。 现以某种顺序 连接…...
云安全与网络安全:核心区别与协同作用解析
在数字化转型的浪潮中,云安全与网络安全作为信息安全的两大支柱,常被混淆但本质不同。本文将从概念、责任分工、技术手段、威胁类型等维度深入解析两者的差异,并探讨它们的协同作用。 一、核心区别 定义与范围 网络安全:聚焦于保…...
【PX4飞控】mavros gps相关话题分析,经纬度海拔获取方法,卫星数锁定状态获取方法
使用 ROS1-Noetic 和 mavros v1.20.1, 携带经纬度海拔的话题主要有三个: /mavros/global_position/raw/fix/mavros/gpsstatus/gps1/raw/mavros/global_position/global 查看 mavros 源码,来分析他们的发布过程。发现前两个话题都对应了同一…...
【大厂机试题解法笔记】矩阵匹配
题目 从一个 N * M(N ≤ M)的矩阵中选出 N 个数,任意两个数字不能在同一行或同一列,求选出来的 N 个数中第 K 大的数字的最小值是多少。 输入描述 输入矩阵要求:1 ≤ K ≤ N ≤ M ≤ 150 输入格式 N M K N*M矩阵 输…...
qt 双缓冲案例对比
双缓冲 1.双缓冲原理 单缓冲:在paintEvent中直接绘制到屏幕,绘制过程被用户看到 双缓冲:先在redrawBuffer绘制到缓冲区,然后一次性显示完整结果 代码结构 单缓冲:所有绘制逻辑在paintEvent中 双缓冲:绘制…...
