zoukankan      html  css  js  c++  java
  • ajax实现跨域访问

    ajax跨域访问是一个老生畅谈的问题啦,网上解决方法很多,discuz用的p3p协议,有兴趣的朋友可以了解下,比较常用的是JSONP方法,貌似目前这种方法只支持GET方式,不如POST方式安全。

    即使使用jquery的jsonp方法,type设为POST,也会自动变为GET。还有一种方式:如果跨域使用POST方式,可以使用创建一个隐藏的iframe来实现,与ajax上传图片原理一样,但这样感觉会比较麻烦。

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

    例如:客户端的域名是www.xyz.com,而请求的域名是www.abc.com

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

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

    解决办法:

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

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

    代码如下:

    a.html 路径:http://www.xyz.com/a.html

    复制代码
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
     <head>
      <meta http-equiv="content-type" content="text/html;charset=utf-8">
      <title> 周伯通跨域测试 </title>
      <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
     </head>
    
     <body>
        <div id="show"></div>
        <script type="text/javascript">
        $.post("http://www.abc.com/server.php",{username:"周伯通",gender:"男"})
          .done(function(data){
            document.getElementById("show").innerHTML = data.username + ' ' + data.gender;
          });
        </script>
     </body>
    </html>
    复制代码

    server.php 路径:http://www.abc.com/server.php

    复制代码
    <?php
    //制作演示,可以用mysql_escape_string
    $ret = array(
        'username' => isset($_POST['username'])? $_POST['username'] : '',
        'gender' => isset($_POST['gender'])? $_POST['gender'] : ''
    );
    
    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($ret);
    ?>
    复制代码

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

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

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

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

    例如允许 www.xyz.com 与 www.xyz2.com 可以跨域访问

    server.php 修改为

    复制代码
    <?php
    $ret = array( 'username' => isset($_POST['username'])? $_POST['username'] : '', 'gender' => isset($_POST['gender'])? $_POST['gender'] : '' ); header('content-type:application:json;charset=utf8'); $origin = isset($_SERVER['HTTP_ORIGIN'])? $_SERVER['HTTP_ORIGIN'] : ''; $allow_origin = array( 'http://www.xyz.com', 'http://www.xyz2.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); ?>
    复制代码
  • 相关阅读:
    什么是 bean 的自动装配?
    什么是 Spring 的内部 bean?
    什么是 Spring 的 MVC 框架?
    Spring AOP and AspectJ AOP 有什么区别?
    解释 JDBC 抽象和 DAO 模块?
    volatile 类型变量提供什么保证?
    一个 Spring Bean 定义 包含什么?
    什么是 Spring MVC 框架的控制器?
    使用 Spring 访问 Hibernate 的方法有哪些?
    什么是 Callable 和 Future?
  • 原文地址:https://www.cnblogs.com/applelife/p/11016682.html
Copyright © 2011-2022 走看看