跨域精简版介绍

虚拟主机跨域

什么是跨域?

跨域,指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对JavaScript施加的安全限制。所以,跨域这个操作是浏览器施加给前端代码的。

只要协议,端口,域名有一个不同,即为跨域!
//引用自: https://www.cnblogs.com/beidan/p/5269817.html

如何跨域?

  1. 浏览器本地配置,允许跨域访问

    方法:既然是浏览器施加的跨域,那么浏览器肯定也可以配置了。这是正确的,所有浏览器都有跨域设置,设置后就可以进行跨域访问了。不过这只是针对于特定用户,对于要按照客户端的BS架构的可以这样设计。

    操作:“浏览器安装路径\Google\Chrome\Application\chrome.exe” --args --disable-web-security --user-data-dir 或者 浏览器安装路径\Google\Chrome\Application\chrome.exe --disable-web-security --user-data-dir=C:\MyChromeDevUserData

    条件:在一个项目使用多个域名的时候,可以使用这种方式来跨域 - 因为这种方式必须是自己能操作到目标文件才行

  2. 后台服务器配置,放开跨域访问策略 - cors跨域

    方法:跨域是因为浏览器施加的,施加原因又是因为后台返回的跨域字符串,所以,第二种就是让后台返回允许跨域。这样访问就顺理成章了。

    代码:header(“Access-Control-Allow-origin:*”);

  3. 其他的访问方式,比如jsonp之类的访问方式

    方法:由于前端的某些标签是可以跨域的。所以又衍生出来了JSONP等跨域方式,这是利用脚本进行跨域的,还有以前的iframe等跨域方式。

    JSONP代码:

    function jsonp(obj){
        window.fn = obj.fn;
        obj.url += "?fname=fn";
        if(obj.data){
            for(var attr in obj.data){
                obj.url += "&" + attr + "=" + obj.data[attr];
            }
        }
        var script = document.createElement("script");
        script.setAttribute("src",obj.url);
        script.setAttribute("name","kuayu");
        document.head.appendChild(script);
        document.head.removeChild(document.querySelector("[name='kuayu']"));
    }
    

    缺点:只为能发送GET请求。

    可以跨域的标签:

    ​ 1. img标签的src能跨域 - img的src把跨域来的文件解析成图片;

    ​ 2. link标签也能跨域 - 把href引入进来的文件当成css解析了;

    ​ 3. iframe标签也能跨域 - 把引入进来的文件当做html标签解析了;

    ​ 4. script标签也能跨域 - 他把引入进来的文件当做js代码解析;


其他:

配置了虚拟主机

在phpstudy上面设置域名站点,然后在c盘的hosts文件中添加解析,hosts文件就是当前电脑的dns解析器

访问网站第一步就是将域名使用dns解析成ip地址,首先会在自己的电脑上找有没有这个解析 - hosts,如果自己电脑上没有,才会去电信运营商的(网络上的dns)解

就是将域名使用dns解析成ip地址,首先会在自己的电脑上找有没有这个解析 - hosts,如果自己电脑上没有,才会去电信运营商的(网络上的dns)解

域名 - 购买, XXX.com XX.cn === 域名对应ip地址的解析,解析规则,使用什么规则解析,使用www来解析 — news.163.com/music.163.com 其实都是自定义的一个规则,这两个域名都是二级域名,通过一级域名自定义了一个解析规则


差点忘了本周总结:
相对于JS源代码的学习来说这个方面确实可以靠靠理解(如果JS基础够好的话),看来我还是要去多复习,JS就我而言真的没有一点捷径可以走,除了多看,就是多练(后者比前者重要一点点),本周主要学习了前后端的交互,ajax和jsonp的原理,以及跨域的操作,和框架bootstrap。

这是我在网易评价里看到的一句话:(愿与各位共勉)
在此也劝所有还在努力学习的学生们一句,你感觉枯燥学不进去是因为学习是一件有难度的事情,无法从中获取巨大的成就感是因为这座金矿太深,把目光放长远,不要被身旁的小石子迷了心智,矿工只有将钩子伸到最低才会明白这座金矿的是大小多么的不可比拟。只有戒骄戒躁才能看见那座别人看不见的金矿
//小故事先缓一缓,最近没看到我满意的故事


大部分是理论的东西,实际上如果有什么错误的地方请及时通知我,我会进行修改。(接受建议,不接受任何批评,没错我是只懒猫啊)

快乐亚索去了

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值