• AJAX跨域请求详解


     最近开始学习ajax,学习ajax必须得掌握的就是跨域请求,实际上在不同源的地址上发送请求就是跨域请求

    域名地址的组成:

    http:// www . google : 8080 / script/jquery.js

          http:// (协议号)

                   www  (子域名)

                 google (主域名)

                   8080 (端口号)

    script/jquery.js (请求的地址)

    * 当协议、子域名、主域名、端口号中任意一各不相同时,都算不同的“域”。

    * 不同的域之间相互请求资源,就叫“跨域”。

    我们所了解的能够发送请求的有 img 、link、script 这些

    ##1    img

    img可以发送不同源地址之间的请求,但是无法拿到响应结果;

    ##2   link

    link可以发送不同源地址之间的请求,但是无法拿到响应结果或者说不能够处理

    #3   script

    script可以发送不同源地址之间的请求,但是无法拿到响应结果,但是能借助于能够作为js执行能获取数据

    跨域请求解决办法----jsonp:

    原理:通过script 标签请求一个服务器端的PHP文件,这个文件返回的结果是一段JS,作用是调用我们事先定义好的一个函数,从而将服务器端想要给客户端发过去的数据发送给客户端。具体实现如下:

    客户端:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body>
        <script>
            var script = document.createElement('script');
            script.src='http://test1.com/jsonp/server.php';
            document.body.appendChild(script);
            function aabb(res){
                console.log(res);
            }
        </script>
    </body>
    </html>

    服务端:

    <?php 
      $conn=mysqli_connect('127.0.0.1','root','root','demo1');
    
      $query=mysqli_query($conn,'select * from users');
    
      while ($row = mysqli_fetch_assoc($query)){
          $data[]=$row;
      }
      // header('Content-Type:application/json');
      // echo json_encode($data);
      // 如果客户端采用的是 script 标记对我发送的请求
      // 一定要返回一段 javascript
    
        header('Content-Type:application/json');
        $result=json_encode($data);
        echo "aabb({$result})";

    注意:但是JSONP只支持 “GET” 请求,但不支持 “POST” 请求。

  • 相关阅读:
    HDU2149-Public Sale
    分页和多条件查询功能
    hdu 4691 最长的共同前缀 后缀数组 +lcp+rmq
    BZOJ 2588 Count on a tree (COT) 是持久的段树
    windows 设置脚本IP
    hdu 4912 Paths on the tree(树链拆分+贪婪)
    分散式-ubuntu12.04安装hadoop1.2.1
    struts详细解释拦截器
    Codeforces 459E Pashmak and Graph(dp+贪婪)
    C#中的数据格式转换 (未完待更新)
  • 原文地址:https://www.cnblogs.com/Yaucheun/p/10492924.html
Copyright © 2020-2023  润新知