--

一年前学的JSONP 跨域，一年后的今天相关知识点基本忘光。花了一天时间重新学习，再次感谢各位前辈的帖子，特此记录如下。

--html

<!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

 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。

ashx+jsonp+document.referrer的更多相关文章

  1. document.referrer 特性

    最近需要用到document.referrer,但是在测试的时候,总是获取为空,百思不得其解. 于是发动百度,看了大量的文章没有一个说到点子上是为什么,后来偶然看到document.referrer ...

  2. 关于document.referrer的使用需要注意

    项目使用到一个场景,ajax请求返回无权限,跳回登录页面,登录后自动返回之前的浏览页,跳转由前端处理,于是想到document.referrer,但是对可靠性不确定,特意搜索了一下相关资料,大致整理如 ...

  3. document.referrer之隐藏来源

    document.referrer document.referrer是用来获取跳转链接的来源,正规的解释是:referrer 属性可返回载入当前文档的文档的 URL. 实际中使用在广告相关业务中较多 ...

  4. 移动端返回上一页，刚需！document.referrer 详解

    返回上一页,在PC端我们可以使用:history.go(-1)或者history.back(),可以正常返回第一层.这样,我们不需要上一页的 url 具体是什么,只要使用 history 一般都没啥问 ...

  5. document.referrer和history.go(-1)退回上一页区别

    javascript:location=document.referrer;和javascript:history.go(-1);区别: 返回上一页,在PC端我们可以使用:history.go(-1) ...

  6. document.referrer的使用和window.opener 跟 window.parent 的区别

    偶尔看到了document.referrer,之前一直有点疑惑与window.opener 和 window.parent之间的区别 首先查了一下w3cSCHOOL, 上面的解释:referrer 属 ...

  7. js获取浏览器上一访问页面URL地址，document.referrer方法

    如题,可用document.referrer方法获取上一页面的url 但是也有不可使用的情况 直接在浏览器地址栏中输入地址: 使用location.reload()刷新(location.href或者 ...

  8. javascript document.referrer 用法

    document对象的referrer属性,返回导航到当前网页的超链接所在网页的URL. 举例: 1. a.html文件内容如下: <a href="b.html">浏 ...

  9. 深入理解document.referrer的用法

    前言 在JavaScript中,document对象有很多属性,其中有3个与对网页的请求有关的属性,它们分别是URL.domain和referrer. URL属性包含页面完整的URL,domain属性 ...

随机推荐

  1. sqlite 插入数据 too many variables

    相关文档:http://www.sqlite.org/limits.html#max_variable_number 一次插入条数限制500,参数最多999个.

  2. css3 animation动画使用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. abstract方法必须在abstract类中 这句话是对的还是错的?

    对 参考文章:https://zhidao.baidu.com/question/435526297.html interface中所有的方法都是抽象的,抽象类中部分方法是抽象的 实现interfac ...

  4. VIO的Bundle Adjustment推导

    IMU模型和运动积分 $R_{\tiny{WB}} \left( t +\Delta{t} \right) = R_{\tiny{WB}} \left( t \right) Exp\left( \in ...

  5. itemgetter和groupby

    一. itemgetter的使用方法 itemgetter()返回一个指定列表下标或者字典键的函数,通过这个返回的函数作用到对象上,获得才能取得相应的值 1. 排序字典列表的一个例子 from ope ...

  6. Java多线程——同步容器类

    1.同步容器类 同步容器类包括Vector和Hashtable,是早期JDK的一部分,这些类实现的方法是:将它们的状态封装起来,并对每个共有的方法进行同步,使得每个线程只有一个线程能访问它们. 1.1 ...

  7. freemaker的函数使用

    如下: <html> <body> <div class="container"> <h4>修改用户角色</h4> &l ...

  8. ConcurrentHashMap相关知识点

    ConcurrentHashMap涉及的知识点:HashMap,HashTable,UnSafe,CAS,数组+链表,Segment,ReentrantLock(非公平锁,公平锁),红黑树. 为什么要 ...

  9. phpStudy mysql升级至5.7

    1.先停止mysql服务,卸载原来的mysql (其他菜单-->服务器管理--->MySQL--->卸载服务) 2.下载MySQL你需要的版本 ZIP Archive 版本 3.解压 ...

  10. 04-树5 Root of AVL Tree （25 分)

    An AVL tree is a self-balancing binary search tree. In an AVL tree, the heights of the two child sub ...