Javascript的jsonp原理
Javascript的jsonp原理
前端代码jsonp.html
<html>
<head>
<meta charset="UTF-8">
<title>Wsscat's jsonp</title>
</head>
<body>
<button onclick="jsonpServer('jsonp.php')">JSONP</button>
</body>
<script>
function jsonpServer(url) {
var script = document.createElement("script");
script.setAttribute("type", "text/javascript");
script.setAttribute("src", url);
document.body.appendChild(script);
}
function JSON_CALLBACK(data) {
console.log(data);
}
</script>
</html>
后端代码jsonp.php
<?php
$data = '[{"id":"1","name":"wsscat"},{"id":"2","name":"asw"}]';
$data = "JSON_CALLBACK(" . $data . ")";
echo $data;
?>
jQuery的jsonp方法
type：请求方式 GET/POSTurl:请求地址async:布尔类型，默认为true 表示请求是否为异步，如果为false表示为同步。dataType：返回的数据类型jsonp：传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)jsonpCallback：自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写"?"，jQuery会自动为你处理数据success：调用成功执行的函数error：异常处理函数
$.ajax({
url:'index.php',
type:'get',
dataType:'jsonp',
//jsonp:'JSON_CALLBACK',
jsonpCallback:'JSON_CALLBACK',
success:function(data){
console.log(data)
}
})
<?php
$data = '[{"id":"1","name":"wsscat"},{"id":"2","name":"asw"}]';
$data = "JSON_CALLBACK(" . $data . ")";
echo $data;
?>
Javascript的jsonp原理的更多相关文章
- Ajax跨域：Jsonp原理解析
推荐先看下这篇文章:JS跨域(ajax跨域.iframe跨域)解决方法及原理详解(jsonp) JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重 ...
- javascript笔记——jsonp
上篇博客介绍了同源策略和跨域访问概念,其中提到跨域常用的基本方式:JSONP和CORS. 那这篇博客就介绍JSONP方式. JSONP原理 在同源策略下,在某个服务器下的页面是无法获取到该 ...
- JQuery实现Ajax跨域访问--Jsonp原理
JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same-Origin Policy”(同源策略).这一策略对于Java ...
- jsonp原理，封装，应用（vue项目）
jsonp原理 JSON是一种轻量级的数据传输格式. JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题.由于同源策略,一般来说位于 ...
- 面试汇总——知道什么是同源策略吗？那怎么解决跨域问题？知道 JSONP 原理吗？
本文是面试汇总分支——知道什么是同源策略吗?那怎么解决跨域问题?知道 JSONP 原理吗?. 同源策略 同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能, ...
- 简单透彻理解JSONP原理及使用
首先提一下JSON这个概念,JSON是一种轻量级的数据传输格式,被广泛应用于当前Web应用中.JSON格式数据的编码和解析基本在所有主流语言中都被实现,所以现在大部分前后端分离的架构都以JSON格式进 ...
- JSONP原理及jQuery中的使用
JSONP原理 JSON和JSONP JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,用于在浏览器和服务器之间交换信息. JSONP(JSON ...
- 跨域JSONP原理及调用详细演示样例
上篇博客介绍了同源策略和跨域訪问概念,当中提到跨域经常使用的基本方式:JSONP和CORS. 那这篇博客就介绍JSONP方式. JSONP原理 在同源策略下,在某个server下的页面 ...
- 跨域篇--JSONP原理
一篇文章让你明白 jsonp原理详解 什么是JSONP? 先说说JSONP是怎么产生的: 其实网上关于JSONP的讲解有很多,但却千篇一律,而且云里雾里,对于很多刚接触的人来讲理解起来有些困难,着用自 ...
随机推荐
- django-5-自定义模板过滤器及标签
<<<代码布局(自定义的代码放哪里)>>> (1)某个app特有的 1.一般放app目录下 固定名为templatetags 的python文件夹里鸭,如果是别的 ...
- ongl表达式中得到对象，调用对象方法(OA项目权限显示模块)
在用户是否拥有某项权限的问题 是这样解决的: 用户登录之后 登录信息是保存在session域中的 通过el表达式可得到登录的对象信息 那么怎样判断用户是否拥有某项权限呢 ?如果没有上图中的判断 ...
- 模仿学习小游戏外星人入侵-Python学习，体会“函数”编程
游戏类如下: # !/usr/bin/python # -*- coding:utf-8 -*- """ Author :ZFH File :alien.py Softw ...
- yii2.0 表单小部件常用的默认选中
下面自己总结了一下表单小部件中经常使用到的一些默认选中 直接在视图代码里面说明啦 <?php //这个表头就不多说了 use yii\helpers\Html; use yii\widgets\ ...
- 1、libgdx简单介绍
Libgdx 是一个跨平台和可视化的的开发框架.它当前支持Windows.Linux,Mac OS X.Android,IOS和HTML5作为目标平台. Libgdx同意你一次编写代码不经改动部署到多 ...
- HDU 1269 -- 迷宫城堡【有向图求SCC的数目 && 模板】
迷宫城堡 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Submi ...
- 【翻译自mos文章】11.2.0.4及更高版本号的asm实例中MEMORY_TARGET 和 MEMORY_MAX_TARGET的默认值和最小值
[翻译自mos文章]11.2.0.4及更高版本号的asm实例中MEMORY_TARGET 和 MEMORY_MAX_TARGET的默认值和最小值 来源于: Default and Minimum ME ...
- 宝马男砍人不慎刀落反被杀 防卫过当or故意伤害（在生命受到威胁的情况下，已经很难判断对方意图了，而且假如于莫是老弱妇幼，可能现在死的就是于莫了）
如果被砍的是周律师他就不会说是防为过当吧,宝马车主跑回自己的车边时最危险,不知道他车上还有什么刀枪之类的.这如果判防卫过当,恶人会更恶,老实人连防卫都不敢了. 不知道在这个没有法治的国家会是如何判案的 ...
- Ruby学习（三）——类与对象（1）
今天看了<Ruby元编程>,感觉内容新颖翔实,是Ruby中难得的一见的好书,在此推荐给大家.其实今天看的主要是第一章的第一部分,先把内容梳理一下,也许这一部分会分成几天的内容来给大家介绍吧 ...
- php静态函数的使用场景
php静态函数的使用场景 场景 代码 <?php class Conductor{ public static $i = 100; public function sold(){ $a = se ...