什么是 CORS
CORS，全称为 Cross-Origin Resource Sharing，即跨域资源共享。我们都知道浏览器有同源策略，不同源的客户端 JavaScript 在没有明确授权的情况下，不能读写彼此的关键信息。但是，现代 Web 应用的常见场景往往需要在不同源之间进行资源共享，CORS 就是为了解决这个问题而生的。
CORS 技术采用了一种预检请求机制，即在实际请求之前，使用 OPTIONS 方法发送一个预检请求，以检测实际请求是否安全。当预检请求获得服务器肯定的响应后，才会发送相应的实际请求。如果实际请求不符合预检请求规范，服务器将返回一个错误响应。
什么是 corslite
corslite 是 npm 上的一个 JavaScript 包，用于在浏览器中发送 CORS 请求。它提供了一个简单的方法来绕过 Same-origin Policy，从而实现在跨域的情况下访问请求数据的能力。
corslite 的特点有：
- 支持 GET、POST、PUT、DELETE 等常见 HTTP 请求方法
- 支持 Promise 和 XMLHttpRequest API
- 支持设置请求头部和请求体
- 兼容大部分现代浏览器
如何使用 corslite
使用 corslite 非常简单，你只需要在你的项目中，通过 npm 安装 corslite 包：
npm install corslite
然后在 JavaScript 中引入 corslite：
import corslite from 'corslite'
现在，你就可以使用 corslite 发送 CORS 请求了，接下来，我们看一个简单的例子。
corslite('https://api.github.com/users/github?client_id=XXXXX', function (err, response) {
if (err) {
console.log(err)
} else {
console.log(response)
}
})在这个例子里，我们发送了一个 GET 请求到 https://api.github.com/users/github?client_id=XXXXX，并且传入了一个回调函数，在请求成功或错误时都会调用。
如果你觉得 corslite 的回调风格有点老套，也可以使用 Promise 的方式来发送请求：
corslite('https://api.github.com/users/github?client_id=XXXXX')
.then(function (response) {
console.log(response)
})
.catch(function (err) {
console.log(err)
})设置请求头和请求体
要为 corslite 请求设置请求头和请求体，你只需要在 corslite 函数中传入第三个参数 options。options 的属性包括：
- method：请求方法，默认为 GET。
- headers：请求头对象。
- body：请求体数据。
一个示例：
-- -------------------- ---- -------
------------------------------ -------- ----- --------- -
-----------------------------------
-- -
------- -------
-------- -
--------------- ------------------
--
----- ----------------
----- ------
--
---总结
CORS 是现代 web 应用不可或缺的技术。使用 corslite，你可以在浏览器中轻松地实现 CORS 请求。corslite 有着简单的使用方式和丰富的特性，可以让你的前端工程变得更加高效和便捷。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/77412