以下测试代码使用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. android最常用的退出方法

    public class AppUtils extends Application{ private List<Activity> activityList = new LinkedLis ...

  2. [原]centos6.5系统可用yum源(32位)以及rpmforge

    [10gen] name=10gen Repository baseurl=http://downloads-distro.mongodb.org/repo/redhat/os/i686 gpgche ...

  3. IBM Domino 9 出现 Domino Designer 您正在试图升级多用户安装。请获取正确的安装包以完成升级。 解决方案

    如果网上搜索的其他方法解决不了,那么我的这个方法可以试一下. 出现的场景: 先装好了Notes,后准备装Designer. 在装Designer解压包之后,出现下面的错误,不能安装: 您正在试图升级多 ...

  4. [BZOJ 3223 & Tyvj 1729]文艺平衡树 & [CodeVS 3243]区间翻转

    题目不说了,就是区间翻转 传送门:BZOJ 3223 和 CodeVS 3243 第一道题中是1~n的区间翻转,而第二道题对于每个1~n还有一个附加值 实际上两道题的思路是一样的,第二题把值对应到位置 ...

  5. 最新ecshop v2.7.3版本去版权完全版

    该偏文章模板堂搜集总结,包括ecshop前台版权,ecshop后台版权,一个都不留,干干净净,推荐收藏 一.去掉网页标题 Powered by ECShop 打开includes/lib_main.p ...

  6. JAVA Web day01--- Android小白的第一天学习笔记

    HTML 1.HTML的概述 1.1.HTML简介 l HTML(Hyper Text Markup Language):超文本标记语言. >标记就是标签 >HTML不是一种编程语言,而是 ...

  7. 数据库和3G的结合使用

    // //  设备数据管理类 #import <Foundation/Foundation.h> #import "DeviceInfo.h" @interface D ...

  8. android摇一摇实现(仿微信)

    这个demo模仿的是微信的摇一摇,是一个完整的demo,下载地址在最下面.下面是demo截图:                 步驟: 1.手机摇动监听,首先要实现传感器接口SensorEventLi ...

  9. 一个App Widget实例第一次创建时被调用

    事实上已经有很多的所谓的路由框架做到这一点,我也没有去研究别的,加上一直对backbone这个框架的评价不错,所以就琢磨着怎么用它实现我所需要的SPA的url管理了. 比如,你可能会说"如果 ...

  10. python3 如何使用ip、爬虫

    使用urllib.request.random模块,不说了贴代码 url="*"; iplist=['70.254.226.206:8080'];proxy_support=url ...