jsonp跨域简单应用(一)
转载:http://www.cnblogs.com/cyg17173/p/5865364.html
ashx+jsonp+document.referrer
--
一年前学的JSONP 跨域,一年后的今天相关知识点基本忘光。花了一天时间重新学习,再次感谢各位前辈的帖子,特此记录如下。
--html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
|
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> < html xmlns="http://www.w3.org/1999/xhtml"> < head > < meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> < title >ashx+jsonp+UrlReferrer</ title > < script type="text/javascript" src="Scripts/jquery-1.12.4.min.js"></ script > < script type="text/javascript"> $( function () { $("#btn").click(function () { var url = "http://192.168.1.48:6060/Ashx/test_json.ashx"; $.ajax({ type: "get", async: false, url: url, dataType: "jsonp", //数据类型为jsonp jsonp: "jsonp", //服务端用于接收callback调用的function名的参数 jsonpCallback: "callback",//跟ashx的函数名一致 success: function (result) { alert(result.id+'-'+ result.name + '-'+ result.host); }, error: function (fail) { alert(fail); } }) }); }) </ script > </ head > < body > < div > < a href="http://192.168.1.48:6060/Ashx/test.ashx" >点击跳转ashx</ a > < button id="btn" >json</ button > </ div > </ body > </ html > |
--ashx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain" ; if (context.Request == null || context.Request.UrlReferrer == null ) { context.Response.Write( "error: not get referrer" ); return ; } else { if (context.Request.UrlReferrer.Host.IndexOf( "192.168.1.252" ) > -1) { context.Response.Write( "callback({\"id\": 123,\"name\":\"jason\",\"host\":\"" + context.Request.UrlReferrer.Host + "\"})" ); // 返回字符串前加 callback包裹成JS方法方可解析 } } } |
重要知识点:
1、ashx里面,response输出的json字符串必须包裹在callback()里面,必须和html的jQuery函数jsonpCallback: "callback" 一致。(非常重要,否则报错)。
因为jQuery成功解析的字符串要求如下:
callback({"id": 123,"name":"jason","host":"192.168.1.252"})
2、json的列名必须用双引号包裹,如"name",在C#里加\转义字符,如\"name\"。
3、document.referrer 是只读属性,可防止盗链,伪链,一般使用<a href="">跳转</a> 才不为null,直接使用js跳转window.open()无效,服务器后台界面可使用Response.Redirect("ashx_jsonp")。
4、使用jQuery的click方法也可以获取document.referrer。
jsonp跨域简单应用(一)的更多相关文章
- 原生JS封装Ajax插件(同域&&jsonp跨域)
抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...
- 借助node实战JSONP跨域
一.前言: 浏览器安全是基于同源策略的.所谓同源策略就是三相同: 1.协议相同: 2.域名相同: 3.端口相同. 但,凡事都是有利弊,同源策略也导致了我们想用AJAX跨域请求,但NO!!为了规避这种限 ...
- Jsonp跨域访问
很早之前看过好几篇跨域访问的文章,然后做项目的时候基本没有遇到跨域访问的问题.不过该来的还是会来,前些天终于让我遇到了.于是重温了一下原理这些,再进行实战.于是现在也敢通过实战后的一些理解来和大家分享 ...
- 我的jsonp跨域问题
关于jsonp跨域问题,在这个方面也是了解一点点,先记录下来,主要作为以后查看,之前下载并安装过wampserver,了解到了jsonp和json的区别,现在谈谈跨域这个问题: 首先什么是跨域,简单地 ...
- JSONP跨域的原理解析( 一种脚本注入行为)
JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制, 被称为“some-Origin Policy”(同源策略).这一策略对于Jav ...
- jsonp跨域问题
JSONP是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式). 同源策略限制 ...
- JSONP跨域的原理解析
JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same- Origin Policy”(同源策略).这一策略对于Jav ...
- jsonp 跨域原理详解
JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same-Origin Policy”(同源策略).这一策略对于Java ...
- 【转】JSONP跨域的原理解析
JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same-Origin Policy”(同源策略).这一策略对于Java ...
随机推荐
- Algebraic Kernel ( Arithmetic and Algebra) CGAL 4.13 -User Manual
1 Introduction Real solving of polynomials is a fundamental problem with a wide application range. T ...
- Spring 开发第一步(三)Spring与JDBC
<spring in action 3rd>中的前面4章讲解的是Spring的核心,也就是DI/IOC和AOP .从第5章开始是Spring在企业开发中的各个方面的应用.其实作为笔者从事的 ...
- Django signal 信号机制的使用
Django中提供了"信号调度",用于在框架执行操作时解耦,当某些动作发生的时候,系统会根据信号定义的函数执行相应的操作 一.Django中内置的 signal 类型主要包含以下几 ...
- jzoj5894
先前綴和一發,問題表示求[0-l2][0-r2]滿足條件的數的個數 假設可以把某一個數拆分成[前面任意個數][00-0-11-1(個數相同)]的區間 那麼問題會簡單的多,因為任意一個a位的整數分別xo ...
- docker镜像基本操作一
获取镜像 首先说明一下如何从Docker hub中获取高质量的镜像,从Docker镜像库获取镜像的命令是docker pull .其命令格式为: docker pull [选项] [Docker Re ...
- iOS 中长按手势回调会被触发过两次
Long-press gestures are continuous. The gesture begins (UIGestureRecognizerStateBegan) when the numb ...
- day 64 crm项目(1) admin组件的初识别以及应用
前情提要: 今天进入项目学习阶段,crm 一个又老又土又实用的入门项目 一:django回顾 二:事前准备 1:首先创建django项目 2:在model中创建数据 from django.db im ...
- POJ 1163
#include<iostream> #include<stdio.h> #include<algorithm> using namespace std; int ...
- 剑指offer四十七之求1+2+3+...+n
一.题目 求1+2+3+...+n,要求不能使用乘除法.for.while.if.else.switch.case等关键字及条件判断语句(A?B:C). 二.思路 1.需利用逻辑与的短路特性实现递归终 ...
- 渐进增强与优雅降级 && css3中普通属性和前缀属性的书写顺序
什么是渐进增强与优雅降级? 服务器和浏览器是不同的.当服务器有新版本时,开发人员直接使用新版本的服务器提供服务即可:但是浏览器端,不同的用户使用的浏览器版本不同,型号差异大,我们不可能让用户强制更新 ...