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 ...
随机推荐
- HDU3461_Code Lock
Description 一排可以转动的密码锁,现在给你很多个区间,你可以操作同时转动这个区间内的密码锁,能够通过转动使之一样的密码锁为一种密码 如可以操作2~4这个区间:那么ABBB 和AAAA是一个 ...
- 2019 SCUT SE 新生训练第四波 L - Boxes in a Line——双向链表
先上一波题目 https://vjudge.net/contest/338760#problem/L 这道题我们维护一个双向链表 操作1 2 3 都是双向链表的基本操作 4操作考虑到手动将链表反转时间 ...
- SQL语句优化方式--进阶篇
MYSQL性能 最大数据量 抛开数据量和并发数,谈性能都是扯淡(扯的最疼的那种).Mysql没有限制单表最大记录数,它取决与操作系统对文件大小的限制 文件系统 单文件大小限制 FAT32(采用32位二 ...
- 浮点字符串转int类型报错，解决
一,直接上代码,先转double,再强转int,看你是选择,舍入,还是直接取整数位 var a1 = "1500.76"; var a2 = Convert.ToDouble(a1 ...
- keepalive+nginx
1Nginx+keepAlived负载均衡高可用1.1Nginx+keepAlive架构图 1.1.1主机宕机 1.1.2主机恢复 1.1.3高可用环境 两台nginx,一主一备:192.168.10 ...
- face_recognition人脸识别框架
一.环境搭建 1．系统环境 Ubuntu 17.04 Python 2.7.14 pycharm 开发工具 2.开发环境,安装各种系统包 人脸检测基于dlib,dlib依赖Boost和cmake $ ...
- Tkinter初体验
一.基本步骤 1.导入Tkinter模块 2.创建根窗口 3.填充组件 4.组件关联逻辑 5.进入主循环 二.Code #coding:utf-8 ''' 网关流量校验器 @author: Hongz ...
- 四、附加到进程调试(.NET Framework)
附加到进程调试: 1.需要在IIS配置环境并可运行即通过浏览器可打开. 2.找到项目w3wp.exe进程并附加到进程调试,点击项目添加断点,直接访问浏览器即可. 优点:w3wp.exe是已经运行的,调 ...
- 第11篇Kubernetes部署微服务电商平台
kubernetes部署sock-shop微服务电商平台: 准备条件 确保kubernetes可以访问:reg.yunwei.edu镜像库 需要准备镜像: 部署微服务 ...
- python3.x 浅谈修饰器
#装饰器用法,好处#简化代码,避免重复性代码#打印日志 @log#检测性能 @performance#数据库事务 @transaction#URL路由 @post('/register') 简单例子: ...