Homeword:AJAX

240 阅读3分钟

一、JavaScript 在发送 AJAX 请求时,URL 的域名地址是使用绝对地址还是相对地址?

1.1 什么是URL地址

  • 在说路径之前,先让我们花点时间了解一下什么是 URL 地址吧。URL 全称是统一资源定位器,是因特网上标准的资源的地址(Address),如同在网络上的门牌。一个 URL 地址可以有以下几个组成部分:

    scheme:通信协议,一般为 http 、https;
    host:域名;
    post:端口号,此项为可选项,http 协议默认的端口号为 80,https 协议默认的端口号为 443;
    path:路径,由 "/ "隔开的字符串;
    ?query:查询参数,此项为可选项;
    fragment:信息片段,用于指定网络资源中的某片断,此项为可选项;
    形如:scheme: //host:post/path?query#fragment。

1.2 发送 AJAX 请求时,URL 的域名地址是使用绝对地址还是相对地址?

  • 答案是使用相对地址,使用绝对地址也可以,就有点笨笨的,虽然最后相对地址也会转换为绝对地址。绝对路径的地址写法没啥好说的。至于相对路径,关键是找出需要访问资源的文件与现在文件之前的相对位置关系,这和 Linux 系统的 cd 命令很像。

二、什么是浏览器的跨域访问操作?

2.1 浏览器同源策略

  • 同源策略是一种安全协议,是客户端脚本(尤其是 JavaScript)中重要的安全度量标准,指一段脚本只能读取同一来源的窗口和文档的属性。划重点:何为同源?同源指的是 URL 地址中的 协议、域名、端口三者都相同

2.2 浏览器跨域访问

  • 知道了什么是同源策略,那跨域操作无非就是同源的三个其中几个不同而已。由于浏览器同源政策的影响,跨域的 ajax 请求是不被允许。那为什么要有跨域访问呢?举个小栗子,例如在前后端分离的开发模式下,在本地进行接口联调时:也许在你的项目里,你想尝试前后端分离的开发模式。你在本地开发时,mock 了一些假数据来帮助自己本地开发。而有一天,你希望在本地和后端同学进行联调。此时,后端 rd 的接口地址和你发生了跨域问题。这阻止了你们的联调,你只能继续使用你 mock 的假数据。因此跨域操作是有必要的,可以帮助前后端进行数据交互。

2.3 js 实现跨域访问的常见方法

  • CORS 技术
  • 在服务端设置代理模块(反向代理);
  • 通过修改 window.name 实现跨域;
  • 使用 HTML5 中新引进的 window.postMessage 方法来跨域传送数据。

三、参考文献