搭建 linux + nginx + node + vue3 + mysql 个人博客 - 后台服务篇（四）

前言

什么是跨域？
跨域指的是：浏览器不能执行其他网站的脚本，从一个域名的网页去请求另一个域名的资源时，域名、端口、协议任一不同，都是跨域。跨域是由浏览器的同源策略造成的，是浏览器施加的安全限制。a页面想获取b页面资源，如果a、b页面的协议、域名、端口、子域名不同，所进行的访问行动都是跨域的。
跨域问题是一个不可避免的问题，这里介绍一个 koa2 利用中间件 koa2-cors 解决跨域的简单方式

步骤

1. yarn add koa2-cors 安装 koa2-cors

   	yarn add koa2-cors
   

   

   • npm 安装 npm install koa2-cors

2. app.js 中引入 koa2-cors 并加载中间件

   	// 导入 Koa
   	const Koa = require("koa");
   	const cors = require("koa2-cors");
   	
   	// 创建 koa 实例
   	const app = new Koa();
   	
   	// 解决跨域 - 必须写在路由前面，不然不生效
   	app.use(cors());
   	
   	// 配置路由
   	app.use(require("./routers/r-test.js").routes());
   	app.use(require("./routers/r-upload.js").routes());
   	
   	// 利用 koa 实例监听端口
   	app.listen(3000, () => {
   		console.log("服务启动成功！！！地址：localhost:3000");
   	});
   
   

   

   • 必须写在 router 前面，不然不生效

3. 再次访问接口
   

4. 成功解决跨域
   

到此 koa 跨域问题解决