PHP下ajax跨域的解决方案之window.name实例分析

本文实例讲述了PHP下ajax跨域的解决方案之window.name。分享给大家供大家参考,具体如下:

原理核心:window对象的name属性是一个很特别的属性,当该window的location变化,然后重新加载,它的name属性可以依然保持不变。

依此原理,我们可以在页面A中用iframe加载其他域的页面B,而页面B中用JavaScript把需要传递的数据赋值给 window.name,页面A的iframe加载完成之后,页面A修改iframe的地址,将其变成同域的一个地址,然后就可以读出window.name的值了。

例:有两个网站www.a.com和www.b.com,我们要在www.a.com/a.html下获取www.b.com/data.html数据。

我们需要三个文件:

www.a.com 下的 a.html 获取数据并显示
www.b.com 下的data.html 提供数据
www.a.com 下的proxy.html 代理文件,与a.html同一域下,一般为空html文件。

www.b.com下的data.html如下:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Insert title here</title>
</head>
<body>
  <script type="text/javascript">
    //添加需要传递的数据,大小一般为2M,IE和firefox下可以大至32M左右
    window.name = '[{"name":"test1"},{"name":"test2"}]';
  </script>
</body>
</html>

www.a.com下的proxy.html如下:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Insert title here</title>
</head>
<body>
  <!-- 空的html文件 -->
</body>
</html>

www.a.com下的a.html如下:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Insert title here</title>
</head>
<body>

<!-- 用于引用www.b.com/data.html文件 -->
<iframe id="iframe" src=""></iframe>

<!-- 显示获取到的数据 -->
<div id="data"></div>

<script type="text/javascript" src="./jquery.js"></script>
<script type="text/javascript">
var ifr = document.getElementById("iframe");
ifr.src = "http://www.b.com/data.html";
if (ifr.attachEvent) {
  ifr.attachEvent("onload", loadfunc);
} else {
  ifr.onload = loadfunc;
}

var state = 0;
function loadfunc() {
  if(state == 0) {
    state = 1;
    ifr.contentWindow.location = "http://www.a.com/proxy.html";
  } else {
    var data = ifr.contentWindow.name;
    $.each($.parseJSON(data), function(i, v) {
      $("#data").append(v.name);
    });

    //销毁iframe,保证安全
    ifr.contentWindow.document.write("");
    ifr.contentWindow.close();
    document.body.removeChild(ifr);
  }
}
</script>
</body>
</html>

更多关于PHP相关内容可查看本站专题:《PHP+ajax技巧与应用小结》、《PHP网络编程技巧总结》、《php字符串(string)用法总结》、《php+mysql数据库操作入门教程》及《php常见数据库操作技巧汇总》

希望本文所述对大家PHP程序设计有所帮助。

时间: 2020-03-04

php实现跨域提交form表单的方法【2种方法】

本文实例讲述了php实现跨域提交form表单的方法.分享给大家供大家参考,具体如下: 有时我们为了网站安全考虑,我们不允许直接跨域提交form表单数据,如果我们自己有这个需求呢?下面我们来介绍两种跨域的方法解决直接跨域问题. 下面我们来看看两种php跨域提交form的方法 一.通过php curl function curlPost($url,$params) { $postData = ''; foreach($params as $k => $v) { $postData .= $k . '

PHP下ajax跨域的解决方案之jsonp实例分析

本文实例讲述了PHP下ajax跨域的解决方案之jsonp.分享给大家供大家参考,具体如下: 首先要说明一下json和jsonp的区别? json是一种基于文本的数据交换方式,或者叫做描述数据的一种格式. var person = { "name": "test", "age": "25", "sex": "男" }; var data = [1, 2, 3, 4, 5]; 而jsonp是

两种简单的跨域方法(jsonp、php)

Ajax不能跨域,比如您是www.baidu.com,您就不能请求www.163.com的文件.但您可以请求www.baidu.com/1.json.ent.baidu.com/1.json.这是因为安全原因,对于任何后台语言来说.服务器程序来说,所有的XHR类型的请求,如果来自其他的服务器,将不予应答. 一.使用jsonp JSONP是JSON with Padding的略称.它是一个非官方的协议,出处不可考,它允许在服务器端集成Script tags返回至客户端,通过javascript c

PHP如何实现跨域

因工作需要,客户端软件的一些界面用HTML+CSS+Javascript实现,这些文件放在客户端本地,以本地文件形式加载,但是有些情况下,需要连接服务器取得一些信息,如果不做任何处理,则请求失败,返回的信息如下: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. 这是因为浏览器跨域策略起作用,阻止了

jquery ajax结合thinkphp的getjson实现跨域的方法

本文实例讲述了jquery ajax结合thinkphp的getjson实现跨域的方法.分享给大家供大家参考,具体如下: jquery中post的应该是不能跨域,网上说get的可以跨域,但是我试了一下也不行,然后就进行最后的拼搏getjson,结果成功,哈哈 js处写作: $.getJSON( "/index.php/Index/test", function(data){ alert(data.dd); } ); 语法: jQuery.getJSON(url,[data],[call

PHP ajax跨子域的解决方案之document.domain+iframe实例分析

本文实例讲述了PHP ajax跨子域的解决方案之document.domain+iframe.分享给大家供大家参考,具体如下: 对于主域相同,子域不同,我们可以设置相同的document.domain来欺骗浏览器,达到跨子域的效果. 例如:我们有两个域名:www.a.com 和 img.a.com 在www.a.com下有a.html 在img.a.com下有img.json和img.html这两个文件. img.json就是一些我们要获取的数据: [ { "name" : "

浅析php中jsonp的跨域实例

我们现在www.test.com这个域名下面有这么个html文件testjsonp.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/xhtm

PHP中运用jQuery的Ajax跨域调用实现代码

可以在页面定义一个调用方法,如下: 复制代码 代码如下: function getData(){ $.getJSON("http://123.123.123.123/?callback=?", { "m":"data",// 指定php的文件名字 "act":"getdata",// 指定php文件中的方法 "name":"问题儿童"// 传入的参数 }, funct

PHP防止跨域提交表单

在写用户注册的时候,一定要主要你的表单是否可以跨域提交.php中解决的方法:1.除了在页面做好表但验证之外,还要在提交的服务段的数据进行验证.验证的主要代码如下: 复制代码 代码如下: $servername=$_SERVER['SERVER_NAME'];//当前运行脚本所在服务器主机的名字.  $sub_from=$_SERVER["HTTP_REFERER"];//链接到当前页面的前一页面的 URL 地址  $sub_len=strlen($servername);//统计服务器

php跨域cookie共享使用方法

A 机器所在的域:a1.main.com,A 有应用 main.phpB 机器所在的域:b1.test.com,B 有应用 test.php 1.在 main.php 里设置 cookie 的时候, cookie 的设置方法如下: 复制代码 代码如下: setcookie( "TestCookie",  "okol",  time() + 3600,  "/", "b1.test.com", 1 ); 这样在 test.php

PHP处理Ajax请求与Ajax跨域问题

PHP判断是否为Ajax请求 我们知道,在发送ajax请求的时候,可以通过XMLHttpRequest这个对象,创建自定义的header头信息, 在jquery框架中,对于通过它的$.ajax, $.get, 或者$.post方法请求网页内容时,它会向服务器传递一个HTTP_X_REQUESTED_WITH的参数,php中就是在header一层判断是否是ajax请求,对应的根据$_SERVER['HTTP_X_REQUESTED_WITH']判断.一般情况下$_SERVER['HTTP_X_RE

Springboot解决ajax+自定义headers的跨域请求问题

1.什么是跨域 由于浏览器同源策略(同源策略,它是由Netscape提出的一个著名的安全策略.现在所有支持JavaScript 的浏览器都会使用这个策略.所谓同源是指,域名,协议,端口相同.),凡是发送请求url的协议.域名.端口三者之间任意一与当前页面地址不同即为跨域. 具体可以查看下表: 2.springboot如何解决跨域问题 1.普通跨域请求解决方案: ①请求接口添加注解@CrossOrigin(origins = "http://127.0.0.1:8020", maxAge

原生js实现ajax请求和JSONP跨域请求操作示例

本文实例讲述了原生js实现ajax请求和JSONP跨域请求.分享给大家供大家参考,具体如下: 直接上代码: const ajax = (params = {}) => { const nowJson = params.jsonp ? jsonp(params) : json(params); function jsonp(params){ //创建script标签并加入到页面中 var callbackName = params.jsonp; var head = document.getEle

Ajax 设置Access-Control-Allow-Origin实现跨域访问

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 s

Ajax的jsonp方式跨域获取数据的简单实例

jsonp的调用,今天碰到了,正好整理了一下. <!DOCTYPE html> <html> <head> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#b

vue-cli axios请求方式及跨域处理问题

vue-cli axios请求方式以及跨域处理 安装axios cnpm install axios --save 在要使用axios的文件中引入axios main.js文件 :import axios from 'axois' 要发送请求的文件:import axios from 'axois' 在config/index.js文件设置代理 dev: { proxyTable: {// 输入/api 让其去访问http://localhost:3000/api '/api':{ target

Angular客户端请求Rest服务跨域问题的解决方法

1.问题描述:通过Origin是http://localhost:4200请求http://localhost:8081的服务,控制台报错如下,但是Response为200.客户端和服务端IP相同,但是端口不同,存在跨域问题. 复制代码 代码如下: XMLHttpRequest cannot load http://localhost:8081/api/v1/staffs. No 'Access-Control-Allow-Origin' header is present on the req

jQuery进阶实践之利用最优雅的方式如何写ajax请求

前言 jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 首先需要一个配置文件 var api = { basePath: 'http://192.168.200.226:58080', pathList: [ { name: 'agentHeartBeat',

AJAX请求是否真的不安全?谈一谈Web安全与AJAX的关系

开篇三问 AJAX请求真的不安全么? AJAX请求哪里不安全? 怎么样让AJAX请求更安全? 前言 日前网络中流行围绕AJAX和安全风险的讨伐声浪让人不绝于耳.下面就来详细谈一谈Web安全与AJAX的关系. 本文包含的内容较多,包括AJAX,CORS,XSS,CSRF等内容,要完整的看完并理解需要付出一定的时间. 另外,见解有限,如有描述不当之处,请帮忙及时指出. 正文开始... 从入坑前端开始,一直到现在,AJAX请求都是以极高的频率重复出现,也解决过不少AJAX中遇到的问题,如跨域调试,错误

Django+vue跨域问题解决的详细步骤

跨域 由于开发模式为前后端分离式开发,故而通常情况下,前端和后端可能运行不同的ip或者port下,导致出现跨域问题,故而单独说明 什么是跨域 跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的. 其实我们通常所说的跨域是狭义的,是由浏览器同源策略限制的一类请求场景. 什么是同源策略? 同源策略/SOP(Same origin policy)是一种约定,由Netscape公司1995年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS.