以下测试代码使用php，浏览器测试使用IE9,chrome,firefox,safari

<!DOCTYPE HTML>

<html>

<head>

    <meta charset="UTF-8">

    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.js"></script>

    <script type="text/javascript" id="loadjson"></script>

    <script type="text/javascript">

    // 第一种

    // test1.php在服务器设置请允许跨域(注意：IE9测试不通过)

    $.ajax({

           type: 'POST',

           url: 'http://127.0.0.1:8081/test/test1.php',

           data: 'name=penngo',

           dataType: 'json',

           success: function(msg){

              $('#json').html(JSON.stringify(msg));

           }

        });

    // 第二种

    // test2.php使用jsonp

    $.ajax({

           type: 'GET',

           url: 'http://127.0.0.1:8081/test/test2.php?callback=?',

           data: 'name=penngo',

           dataType: 'jsonp',

           success: function(msg){

              $('#jsonp').html(JSON.stringify(msg));

           }

        });

    // 使用js标签加载方式,该方式为异步，通过testjs()回调

    var testjs = function(msg){

         $('#js').html(JSON.stringify(msg));

    }

    $('#loadjson')[0].src = 'http://127.0.0.1:8081/test/test3.php?method=testjs&name=penngo';

    </script>

</head>

<body>

    header跨域:

    <div id="json">

    </div>

    <br/>

    jsonp跨域:

    <div id="jsonp">

    </div>

    <br/>

    js请求实现跨域:

    <div id="js">

    </div>

</body>

</html>

服务器端处理

test1.php

<?php

    header("Access-Control-Allow-Origin: *");

    $name = $_REQUEST['name'];

    $result = array('success'=>1, 'name'=>$name);

    echo json_encode($result);

?>

test2.php

<?php

    $callback = $_REQUEST['callback'];

    $name = $_REQUEST['name'];

    $result = array('success'=>1, 'name'=>$name);

    $jsonData = json_encode($result);

    echo $callback . "(" . $jsonData . ")";

?>

test3.php

<?php

    $method = $_REQUEST['method'];

    $name = $_REQUEST['name'];

    $result = array('success'=>1, 'name'=>$name);

    $jsonData = json_encode($result);

    echo "$method($jsonData);";

?>

IE9测试，页面输出内容

header跨域:

jsonp跨域:

{"success":1,"name":"penngo"}

js请求实现跨域:

{"success":1,"name":"penngo"}

chrome,firefox,safari测试，页面输出内容

header跨域:

{"success":1,"name":"penngo"}

jsonp跨域:

{"success":1,"name":"penngo"}

js请求实现跨域:

{"success":1,"name":"penngo"}

 

web三种跨域请求数据方法的更多相关文章

  1. js跨域请求数据的3种常用的方法

    由于js同源策略的影响,当在某一域名下请求其他域名,或者同一域名,不同端口下的url时,就会变成不被允许的跨域请求.那这个时候通常怎么解决呢,对此菜鸟光头我稍作了整理:1.JavaScript   在 ...

  2. 同源策略（same-origin policy）及三种跨域方法

    同源策略(same-origin policy)及三种跨域方法 1.同源策略 含义: 同源是指文档的来源相同,主要包括三个方面 协议 主机 载入文档的URL端口 所以同源策略就是指脚本只能读取和所属文 ...

  3. 基于.Net Framework 4.0 Web API开发（5）：ASP.NET Web APIs AJAX 跨域请求解决办法（CORS实现）

    概述:  ASP.NET Web API 的好用使用过的都知道,没有复杂的配置文件,一个简单的ApiController加上需要的Action就能工作.但是在使用API的时候总会遇到跨域请求的问题,特 ...

  4. WebApi Ajax 跨域请求解决方法（CORS实现）

    概述 ASP.NET Web API 的好用使用过的都知道,没有复杂的配置文件,一个简单的ApiController加上需要的Action就能工作.但是在使用API的时候总会遇到跨域请求的问题, 特别 ...

  5. WebApi Ajax 跨域请求解决方法（CORS实现）（作者：jianxuanbing）

    概述 ASP.NET Web API 的好用使用过的都知道,没有复杂的配置文件,一个简单的ApiController加上需要的Action就能工作.但是在使用API的时候总会遇到跨域请求的问题,特别各 ...

  6. 从壹开始前后端分离【 .NET Core2.0 +Vue2.0 】框架之十二 || 三种跨域方式比较，DTOs(数据传输对象)初探

    更新反馈 1.博友@落幕残情童鞋说到了,Nginx反向代理实现跨域,因为我目前还没有使用到,给忽略了,这次记录下,为下次补充.此坑已填 2.提示:跨域的姊妹篇——<三十三║ ⅖ 种方法实现完美跨 ...

  7. jquery 跨域请求数据问题

    昨天参加了一个前端的面试,被问到一个跨域请求数据问题,我们之前一直用的是apicloud的api进行请求的,跨域是被apicloud封装起来的,也就没有注意跨域请求数据的问题.当被问到用jquery跨 ...

  8. $Django 前后端之 跨域问题(同源策略) vue项目(axios跨域请求数据)

    1 跨域问题(多个域之间的数据访问) #同源策略(ip port 协议全部相同) #本站的只能请求本站域名的数据 #CORS实现(跨域资源共享) #实现CORS通信的关键是服务器.只要服务器实现了CO ...

  9. Nginx反向代理、CORS、JSONP等跨域请求解决方法总结

    由于 Javascript 同源策略的存在使得一个源中加载来自其它源中资源的行为受到了限制.即会出现跨域请求禁止. 通俗一点说就是如果存在协议.域名.端口或者子域名不同服务端,或一者为IP地址,一者为 ...

随机推荐

  1. 基于css3的轮播效果

    花了一上午来调整页面在ie10上的显示问题,sass编译生成的css文件在ie内核下一直不能正确加载,果然兼容性的问题还需要好好研究.转入正题,用css3实现轮播效果主要是基于css3的framewo ...

  2. 基于ReentrantLock的AQS的源码分析（独占、非中断、不超时部分）

    刚刚看完了并发实践这本书,算是理论具备了,看到了AQS的介绍,再看看源码,发现要想把并发理解透还是很难得,花了几个小时细分析了一下把可能出现的场景尽可能的往代码中去套,还是有些收获,但是真的很费脑,还 ...

  3. 2016 - 1 - 27 javaScrip初步(一)

    <head> </head> <body> <!-- The onclick attribute is the code that happens when ...

  4. GnuRadio Hacking①：使用GnuRadio+SDR破解固定码无线遥控

    0×01 信号捕获 在这篇文章中,我们将使用GnuRadio+SDR硬件对某品牌型号的无线跳蛋进行无线重放攻击的演示. 市面上常见的无线遥控工作的频段,通常工作在315Mhz.433Mhz,也有少数的 ...

  5. java开发命名规范

    使用前注意事项: 1.  由于Java面向对象编程的特性, 在命名时应尽量选择名词 2.  驼峰命名法(Camel-Case): 当变量名或函式名是由一个或多个单字连结在一起,而构成的唯一识别字时,首 ...

  6. 兼容解决 IE 、火狐、谷歌浏览器中 Iframe框架的页面缓存的方法

    <script type="text/javascript"> document.write('<iframe src="/ad_footer.html ...

  7. C#常用操作类库一(验证类)

    public class Validator    {        #region  验证输入字符串为数字        /// <summary>        /// 验证输入字符串 ...

  8. C#拼接SQL语句，SQL Server 2005+，多行多列大数据量情况下，使用ROW_NUMBER实现的高效分页排序

    /// <summary>/// 单表(视图)获取分页SQL语句/// </summary>/// <param name="tableName"&g ...

  9. discuz不能发表投票、附件上传等

    如何开启和发表投票主题 本教程主要讲述如何开启和发表投票的帖子.具体的操作如下: 1.论坛后台 => 用户 => 用户组 => 详情 => 特殊主题 => 允许发起投票设 ...

  10. Nginx Debug Log

    //检查nginx.conf时(sudo ./nginx -t),输出数据到检测结果 //ngx_conf_log_error(NGX_LOG_EMERG, cf, 0, "配置解析处理&q ...