jsonp协议 java服务端、JQuery客户端 简单实现原理
原文链接：https://blog.csdn.net/Activity_Time/article/details/96440806
1. 概述
Jsonp(JSON with Padding) 是 json 的一种"使用模式"，可以让网页从别的域名（网站）那获取资料，即跨域读取数据。
为什么我们从不同的域（网站）访问数据需要一个特殊的技术( JSONP )呢？这是因为同源策略。
同源策略，它是由 Netscape 提出的一个著名的安全策略，现在所有支持 JavaScript 的浏览器都会使用这个策略。
ajax本身是不可以跨域的，
通过产生一个script标签来实现跨域。因为script标签的src属性是没有跨域的限制的。
其实设置了dataType: 'jsonp'后，$.ajax方法就和ajax XmlHttpRequest没什么关系了，取而代之的则是JSONP协议。JSONP是一个非官方的协议，它允许在服务器端集成Script tags返回至客户端，通过javascript callback的形式实现跨域访问。
2. 客户端实现原理
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JSONP 实例</title>
</head>
<body>
<div id="divCustomers"></div>
<script type="text/javascript">
// 回调函数
function callbackFunction(result)
{
document.getElementById('divCustomers').innerHTML = result;
}
</script>
<!-- 访问菜鸟教程的jsonp示例 -->
<script type="text/javascript" src="https://www.runoob.com/try/ajax/jsonp.php?jsoncallback=callbackFunction"></script>
</body>
</html>
3. JQuery实现
$.getJSON("https://www.runoob.com/try/ajax/jsonp.php?jsoncallback=?",function(json){
alert(json);
//要求远程请求页面的数据格式为： ?(json_data)
//例如：
//?("test") alert(json[0]._name);
//JQuery会随机生成一个函数名 例如：jQuery110206760198562063544_1563445396212
});
也可以使用ajax函数
$.ajax('https://www.runoob.com/try/ajax/jsonp.php', {
method: 'post',
contentType: 'application/javascript;charset=utf-8',
dataType: 'jsonp', // jsonp方式
jsonp: 'jsoncallback', // 回调函数名-参数名
success: function (result) {
// 回调函数
console.log(result);
}
});
$("#jkl").html(parseInt($("#jkl").html()) + 1);
}
4. 服务端原理
protected void service(HttpServletRequest request, HttpServletResponse resp) throws ServletException, IOException {
String msg = "测试信息";
// jsonp跨域协议
resp.addHeader("content-type", "application/javascript");
String func = request.getParameter("jsoncallback");
PrintWriter pw = resp.getWriter();
pw.print(func + "('" + msg + "');");
pw.flush();
}
参考文章：
菜鸟教程：https://www.runoob.com/jquery/jquery-tutorial.html
jsonp原理详解：https://blog.csdn.net/hansexploration/article/details/80314948
jquery中ajax处理跨域的三大方式：https://www.jb51.net/article/77470.htm
jsonp协议 java服务端、JQuery客户端 简单实现原理的更多相关文章
- java socket实现服务端，客户端简单网络通信。Chat
之前写的实现简单网络通信的代码,有一些严重bug.后面详细写. 根据上次的代码,主要增加了用户注册,登录页面,以及实现了实时显示当前在登录状态的人数.并解决一些上次未发现的bug.(主要功能代码参见之 ...
- rsync 服务端和客户端 简单配置
环境:Centos 6.9 两台服务器,A(192.168.223.129) 和 B(192.168.223.130).A 作为服务端,B作为客户端从A服务器同步目录.把A的/usr/src 目录下的 ...
- RPC学习--C#使用Thrift简介，C#客户端和Java服务端相互交互
本文主要介绍两部分内容: C#中使用Thrift简介 用Java创建一个服务端,用C#创建一个客户端通过thrift与其交互. 用纯C#实现Client和Server C#服务端,Java客户端 其中 ...
- C#使用Thrift简介，C#客户端和Java服务端相互交互
C#使用Thrift简介,C#客户端和Java服务端相互交互 本文主要介绍两部分内容: C#中使用Thrift简介 用Java创建一个服务端,用C#创建一个客户端通过thrift与其交互. 用纯C#实 ...
- 用Java实现HTTP Multipart的服务端和客户端
今天简单介绍一下如何用Java支持HTTP Multipart的request和response. 整个项目的代码可以在https://github.com/mcai4gl2/multi下载. 在这个 ...
- 采用MQTT协议实现android消息推送（2）MQTT服务端与客户端软件对比、android客户端示列表
1.服务端软件对比 https://github.com/mqtt/mqtt.github.io/wiki/servers 名称(点名进官网) 特性 简介 收费 支持的客户端语言 IBM MQ 完整的 ...
- Java 断点下载(下载续传)服务端及客户端（Android）代码
原文: Java 断点下载(下载续传)服务端及客户端(Android)代码 - Stars-One的杂货小窝 最近在研究断点下载(下载续传)的功能,此功能需要服务端和客户端进行对接编写,本篇也是记录一 ...
- “快的打车”创始人陈伟星的新项目招人啦，高薪急招Java服务端/Android/Ios 客户端研发工程师/ mysql DBA/ app市场推广专家，欢迎大家加入我们的团队！ - V2EX
"快的打车"创始人陈伟星的新项目招人啦,高薪急招Java服务端/Android/Ios 客户端研发工程师/ mysql DBA/ app市场推广专家,欢迎大家加入我们的团队! - ...
- 一些java考过的测试题和自己制作模拟服务端和客户端
媒体 1,java环境变量: PATH: .;%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin; CLASSPATH: .;%JAVA_HOME%\jre\lib\rt.jar ...
随机推荐
- JavaScript 类型浅解
对于JavaScript 类型,可简单地概括为:相对于强类型语言来说,它是弱(松散)类型的语言:有基本类型和引用类型,他们是区别是一个有固定空间存在于栈内存中,一个没有固定空间保存在堆内存中并且在栈内 ...
- Php邮件发送源码
好久冒写点东西了.....最近生活压抑的很....为生活而劳累,整理下邮件发送的实例了,网上也有很多,我这个也是提取整理好的,测试Ok,首页邮件类smtp_email_class.php如下:< ...
- github 上的PHP资源大全
依赖管理 ——用于依赖管理的包和框架Composer/Packagist : 一个包和依赖管理器Composer Installers: 一个多框架Composer库安装器Pickle: 可以在任意 ...
- 记录规则(recording rules)与告警规则(alerting rule)
记录规则(recording rules) 配置规则 Prometheus支持两种类型的规则,可以对其进行配置,然后定期进行评估:记录规则和警报规则.要在Prometheus中包含规则,请创建一个包含 ...
- pssh系列命令详解
安装 pssh提供OpenSSH和相关工具的并行版本.包括pssh,pscp,prsync,pnuke和pslurp.该项目包括psshlib,可以在自定义应用程序中使用.pssh是python写的可 ...
- （转）SQL注入原理
原文地址:http://www.cnblogs.com/rush/archive/2011/12/31/2309203.html SQL Injection:就是通过把SQL命令插入到Web表单递交或 ...
- pytorch与numpy中的通道交换问题
pytorch网络输入图像的格式为(C, H, W),而numpy中的图像的shape为(H,W,C) 所以一般需要变换通道,将numpy中的shape变换为torch中的shape. 方法如下: # ...
- arcpy脚本使用多接图表图斑对对应多幅影像进行裁边处理
插个广告,制作ArcGIS的Tool工具学习下面的教程就对了: 零基础学习Python制作ArcGIS自定义工具观看链接 <零基础学习Python制作ArcGIS自定义工具>课程简介 先将 ...
- python基础类型(字典:dict)
字典的介绍: 字典(dict)Python中唯一的一个映射类型.他是以{}括起来的键值对组成,在dict中key是唯一的.在保存的时候,根据key来计算出一个内存地址,然后将key-value保存到这 ...
- ORM--SqlSugar
这个是很久之前就开始用的一款ORM,挺好用的,推荐~ 关键词: SqlSugar:一款小巧,并且功能齐全的ORM 参考手册网址:http://www.codeisbug.com/Home/Doc 多表 ...