13703353520(同微信) 周一~周五, 8:00 - 20:00
QQ:25681881或25295110 邮箱:qhdzxz@163.com
易得优软件 河北•秦皇岛
  • 站群系统

    自主建站,易得优自主建站站群系统

  • 易得优餐饮库管系统

    十七年专注开发

  • 易得优智能工控

    智能工控,易得优是认真的

  • 音乐打铃播放无需电脑

    易得优音乐打铃系统无电脑版

跨域及其设置方法

    时间:2019-06-14 15:07:33     人气:3748


《跨域及其设置方法》一文刊发于《网络安全和信息化》2019年第6期。



 跨域及其设置方法.jpg



一、什么是跨域?


        浏览器从一个域名的网页去请求另一个域名的资源时,域名、端口、协议任一不同,都被视为跨域访问,也就是浏览器对于javascript的同源策略的限制。所谓同源策略,即请求的url地址,必须与浏览器上的url地址处于同域上,也就是域名,端口,协议都必须相同。例如a.com下面的js不能调用b.com中的js、对象或数据。


        下面的几种情况均属于跨域访问。


        域名不同:


            主域名不同: 


http://www.qhdedu.com/index.html访问http://www.qhdedu.net/1.js


           子域名不同: 


http://www.qhdedu.com/index.html访问http://w3.qhdedu.com/1.js


           域名和域名ip:


 http://www.qhdedu.com/index.html访问http://106.75.53.220/1.js

      

       端口不同:


http://www.qhdedu.com:8080/index.html访问http://www.qhdedu.com:8081/1.js


       协议不同:


http://www.qhdedu.com:8080/index.html访问https://www.qhdedu.com:8080/1.js


        允许跨域访问会带来许多安全性的问题,比如一般用于状态控制的cookie,常用于存储登录的信息,如果不禁止跨域访问,那么别的网站只需要一段脚本就可以获取你的cookie,从而冒充你的身份去登录网站,造成非常严重的安全问题。因此,浏览器均推行同源策略,各种WEB服务器也默认禁止跨域访问,要想网站允许跨域访问,还需要进行相关的设置。


二、跨域的设置


1、IIS的设置:


        打开IIS,找到并点击“HTTP响应标头”,在右侧可就以看到“添加”,然后添加如下标头即可:


Access-Control-Allow-Origin:*

Access-Control-Allow-Methods GET,POST,PUT,DELETE,OPTIONS

Access-Control-Allow-Headers:Content-Type, api_key, Authorization

 

图1  IIS中HTTP响应头


       或者直接在Web.config配置文件中写入:


<configuration>

<system.webServer>

<httpProtocol>

<customHeaders>

<add name="Access-Control-Allow-Origin" value="*" />

<add name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE,OPTIONS" />

<add name="Access-Control-Allow-Headers" value="Content-Type,Accept" />

</customHeaders>

</httpProtocol>

</system.webServer>

</configuration>


        其中,Access-Control-Allow-Origin表示请求来源,“*”表示不限定即允许任何域名访问;Access-Control-Allow-Methods表示请求方法;Access-Control-Allow-Headers表示请求消息头。


2、Apache的设置:


        首先在配置文件httpd.conf中找到下面这行,并把#注释符去掉,以开启Apache头信息自定义模块。


#LoadModule headers_module modules/mod_headers.so


        然后修改站点的配置文件:


<Directory "/home/wwwroot/php.qhdedu.net">

    AllowOverride None

    Require all granted

    Header set Access-Control-Allow-Origin *

</Directory>


        Header set Access-Control-Allow-Origin *行末的“*”表示允许所有的域名访问,当然这是很危险的,较为安全的配置,应该是直接指定具体的域名。如果直接指定具体的域名,那么就要用Header add而不是Header set,否则只有最后一行的配置生效: 


<Directory "/home/wwwroot/php.qhdedu.net">

    AllowOverride None

    Require all granted

    Header add Access-Control-Allow-Origin "poms.qhdedu.net"  

    Header add Access-Control-Allow-Origin "wg.qhdedu.net"

</Directory>


        设置后需要重启Apache生效。


3、Nginx的设置:


        Nginx也是通过配置Access-Control-Allow-Origin来解决跨域问题,但是此参数只允许配置单个域名“add_header Access-Control-Allow-Origin www.qhdedu.com”或者“add_header Access-Control-Allow-Origin *”允许全部域名,如果需要允许多个域名跨域访问时可以用map来实现,具体配置代码如下:


map $http_origin $corsHost {

    default 0;

    "~http://w1.qhdedu.com" http://w1.qhdedu.com;

    "~http://w2.qhdedu.com" http://w2.qhdedu.com;

    "~http://w3.qhdedu.com" http://w3.qhdedu.com;

}


server

{

    listen 80;

    server_name www.qhdedu.com;

    root /nginx;

    location /

    {

        add_header Access-Control-Allow-Origin $corsHost;

add_header Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept";

        add_header Access-Control-Allow-Methods "GET, POST, OPTIONS";

    }

}

        第二种方式:


location ~* .(ttf|ttc|otf|eot|woff|font.css)$ {

    if ($http_origin = 'http://w1.qhdedu.com') {

        add_header 'Access-Control-Allow-Origin' "$http_origin";

    }

    if ($http_origin = 'http://w2.qhdedu.com') {

        add_header 'Access-Control-Allow-Origin' "$http_origin";

}

if ($http_origin = 'http://w3.qhdedu.com') {

        add_header 'Access-Control-Allow-Origin' "$http_origin";

    }

}