• 跨域相关


    一、产生跨域原因:因为浏览器同源策略(同源策略阻止从某个域上加载的脚本,获取或操作另一个域上的文档属性。也就是说,请求的 URL 的域必须与当前 Web页面的域相同。)


    二、哪些情况会产生跨域:

    1.域名不同  2.端口不同  3.协议不同  4.域名和域名对应的ip地址


    三、解决跨域

      1.后端代理(后端因为脱离了浏览器,因此浏览器的同源策略对其无效)

        php:在php文档里通过file_get_contents(url):获取url里面的数据,再echo输出,提供接口。这样ajax请求该php文件,得到数据。
      
      2.跨域资源共享-CORS
        CORS需要浏览器和服务器同时支持,才可以实现跨域请求,目前几乎所有浏览器都支持CORS,IE则不能低于IE10。CORS的整个过程都由浏览器自动完成,前端无需做任何设置,跟平时发送ajax请求并无差异。so,实现CORS的关键在于服务器,只要服务器实现CORS接口,就可以实现跨域通信。                                                                                                                       
    加上以下两句代码实现跨域:
        header("Access-Control-Allow-Origin:*"); // 指定允许其他域名访问
        header("Access-Control-Request-Methods:GET, POST"); //指定请求方式 响应类型
     
      3.jsonp(前端方式):json with padding将json填充到函数内部以实参形式返回
        script标签会把请求回来的所有内容当作js代码来执行--script标签不存在跨域。每一个script拥有作用域。即src引入的即便是txt、rar,一样当作js代码执行。
        后端通过file_get_contents(url)把获取到的json数据作为实参传递,前端通过script引入php(注意位置在最后面),然后function一个函数,函数名与后端函数名一致,这样函数内部就可以操作请求到的json数据。(如果第三方的接口提供了jsonp的数据格式,可完全脱离后端取到数据。)
        实际开发中,函数名前后端统一会造成不必要的困扰,例如前端修改函数名,后端也必须修改。可通过以下操作优化:
    //isset():判断括号里面的变量是否存在,返回布尔值
    $fname = isset($_GET['callback']) ? $_GET['callback'] : 'fn';//url中?后携带的健值对里有callback(回调函数)这个key时,则用callback值作函数名。这样前端在url中就可以把callback值任意取名
    $joke = file_get_contents('http://www.kuitao8.com/api/joke');
    echo $fname . '(' . $joke . ')';

    大自然不需要代码,但人类需要。——作者留

  • 相关阅读:
    从入门到不放弃系列之Koa2
    进击Node.js基础(二)
    进击Node.js基础(一)
    探知浏览器并发请求个数
    Elasticsearch 聚合操作
    Elasticsearch 数据查询
    Elasticsearch 数据操作
    Elasticsearch 映射操作
    Elasticsearch 索引操作
    IDEA类和方法注释模板设置
  • 原文地址:https://www.cnblogs.com/QQ1210611769/p/12431204.html
Copyright © 2020-2023  润新知