一说到ajax跨域。首先想到的就是jsonp  。

JSONP方法是一种非官方方法,而且这种方法只支持GET方式,不如POST方式安全。

即使使用jQuery的jsonp方法,type设为POST,也会自动变为GET。

官方问题说明:

“script”: Evaluates the response as JavaScript and returns it as plain text. Disables caching by appending a query string parameter,
“_=[TIMESTAMP]“, to the URL unless the cache option is set to true.Note: This will turn POSTs into GETs for remote-domain requests.

如果跨域使用POST方式,可以使用创建一个隐藏的iframe来实现,与ajax上传图片原理一样,但这样会比较麻烦。

因此,通过设置Access-Control-Allow-Origin来实现跨域访问比较简单。

例如:客户端域名:www.aaa.com     服务端域名:www.bbb.com

如果直接使用ajax访问,会有以下错误

XMLHttpRequest cannot load http://www.server.com/server.PHP. No 'Access-Control-Allow-Origin' header is present on the requested resource.Origin 'http://www.client.com' is therefore not allowed access.

在被请求的Response header中加入

<?php

// 指定允许其他域名访问
header('Access-Control-Allow-Origin:*');
// 响应类型
header('Access-Control-Allow-Methods:POST');
// 响应头设置
header('Access-Control-Allow-Headers:x-requested-with,content-type'); ?>

就可以实现ajax POST跨域访问了。

代码如下:

test.html 路径:http://www.aaa.com/test.html

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title> 跨域测试 </title>
<script src="http://code.jquery.com/jquery.js"></script>
</head> <body>
<div id="show"></div>
<script type="text/javascript">
$.post("http://www.bbb.com/test.php",{name:"111",number:"222"})
.done(function(data){
    console.log(data);
});
</script>
</body>
</html>

test.php 路径:http://www.bbb.com/test.php

<?php
$data= array(
'name' => isset($_POST['name'])? $_POST['name'] : '',
'number' => isset($_POST['number'])? $_POST['number'] : ''
); header('content-type:application:json;charset=utf8');
header('Access-Control-Allow-Origin:*');
header('Access-Control-Allow-Methods:POST');
header('Access-Control-Allow-Headers:x-requested-with,content-type'); echo json_encode($data);
?>

Access-Control-Allow-Origin:* 表示允许任何域名跨域访问

如果需要指定某域名才允许跨域访问,只需把Access-Control-Allow-Origin:*改为Access-Control-Allow-Origin:允许的域名

例如:header('Access-Control-Allow-Origin:http://www.aaa.com');

如果需要设置多个域名允许访问,这里需要用php处理一下

例如允许 www.aaa1.com 与 www.aaa2.com 可以跨域访问

<?php
$ret = array(
'name' => isset($_POST['name'])? $_POST['name'] : '',
'number' => isset($_POST['number'])? $_POST['number'] : ''
); header('content-type:application:json;charset=utf8'); $origin = isset($_SERVER['HTTP_ORIGIN'])? $_SERVER['HTTP_ORIGIN'] : ''; $allow_origin = array(
'http://www.aaa1.com',
'http://www.aaa2.com'
); if(in_array($origin, $allow_origin)){
header('Access-Control-Allow-Origin:'.$origin);
header('Access-Control-Allow-Methods:POST');
header('Access-Control-Allow-Headers:x-requested-with,content-type');
} echo json_encode($ret);
?>

ajax 跨域访问 :Access-Control-Allow-Origin的更多相关文章

  1. Hbuilder编辑App时,ajax跨域访问失败问题

    今天试着用Hbuilder写app的前段显示页面,在第一步时就被打住了,ajax异步调用服务器的登录接口时,报错, 显示这样的错误 XMLHttpRequest cannot loadhttp://w ...

  2. Ajax跨域访问解决办法

    方法1. jsonp实现ajax跨域访问示例 jsp代码: <body> <input type="button" onclick="testJsonp ...

  3. 浅析JSONP-解决Ajax跨域访问问题

    浅析JSONP-解决Ajax跨域访问问题 很久没有写随笔了,总是感觉没时间,其实时间就是...废话少说,前几天,工作上有一新需求,需要前端web页面异步调用后台的Webservice方法返回信息.实现 ...

  4. ajax跨域访问的解决方案

    今天的工作中要访问摄像机内部的一个web站点,这就涉及到jquery的ajax跨域访问的问题.我使用的是jquery1.7的版本,下面总结如下: 问题一:一开始用IE调试,总是返回No Transpo ...

  5. Web Api 2(Cors)Ajax跨域访问

    支持Ajax跨域访问ASP.NET Web Api 2(Cors)的简单示例教程演示   随着深入使用ASP.NET Web Api,我们可能会在项目中考虑将前端的业务分得更细.比如前端项目使用Ang ...

  6. ajax 跨域访问的解决方案

    ajax 跨域访问的解决方案 一.什么是跨域: 1.什么样的请求属于跨域: 域名,端口有任何一个不相同都属于跨域: 二.跨域的常用几种解决方案: 1.jsonp: 2.iframe: 3.webcon ...

  7. 关于JQuery Ajax 跨域 访问.net WebService

    关于这个 jQuery Ajax跨域访问 WebService 前天整了好几个小时没整明白 今天再看一下 结果突然就顿悟了 1.建一个空webApplication --添加--新建项--web服务( ...

  8. JS Ajax跨域访问

    js ajax跨域访问报"No 'Access-Control-Allow-Origin' header is present on the requested resource 如果请求的 ...

  9. ajax跨域访问http服务--jsonp

    在前面一篇文章<Spring Cloud 前后端分离后引起的跨域访问解决方案>里我们提到使用ajax跨域请求其他应用的http服务,使用的是后台增加注解@CrossOrigin或者增加Co ...

随机推荐

  1. RP2833 FPGA对应串口标识

    U41 FPGA-TXD0         /dev/ruart0        FPGA-RXD0      U40 FPGA-TXD1         /dev/ruart1 FPGA-RXD1

  2. MVC教程三:URL匹配

    1.使用{parameter}做模糊匹配 {parameter}:花括弧加任意长度的字符串,字符串不能定义成controller和action字母.默认的就是模糊匹配. 例如:{admin}. usi ...

  3. Windows 10恢复Shift+右键打开命令提示符窗口

    导入以下注册表即可. Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\Directory\Background\shell\cmd1] ...

  4. chrome 如何利用快捷键将光标移动到地址栏

    Windows: Ctrl + L 或 Alt + D 或 F6 Mac: Command + LLinux: Ctrl + L

  5. 总结一发linux常用命令

    显示目录和文件的命令 Ls:用于查看所有文件夹的命令. Dir:用于显示指定文件夹和目录的命令   Tree: 以树状图列出目录内容 Du:显示目录或文件大小 修改目录,文件权限和属主及数组命令 Ch ...

  6. Java获取yahoo天气预报

    学习闲暇之余,写了个获取yahoo天气预报的java小程序,仅供娱乐. 首先我们需要获取您需要查询城市对应的代号,我们可以用HashMap来查询,代码如下: publicstatic HashMap& ...

  7. (转)I,P,B帧和PTS,DTS的关系

    基本概念: I frame :帧内编码帧 又称intra picture,I 帧通常是每个 GOP(MPEG 所使用的一种视频压缩技术)的第一个帧,经过适度地压缩,做为随机访问的参考点,可以当成图象. ...

  8. 10篇写给Git初学者的最佳教程(转)

    身为网页设计师或者网页开发者的你,可能已经听说过Git这个正快速成长的版本控制系统.它由GitHub维护:GitHub是一个开放性的.存储众人代码的网站.如果你想学习如何使用Git,请参考本文.在文章 ...

  9. html dom基本操作

    //div出滚动条: <div id="discussion" style="height:500px;overflow:auto;"></d ...

  10. 远程连接mysql数据库提示:ERROR 1130的解决办法

    From: http://blog.sina.com.cn/s/blog_716844910100welz.html 在linux下使用mysql客户端连接远程mysql服务器报错: [root@Se ...