前后端链条产生的跨域问题

环境:

vite+vue3

.net 6 vsstudio2022C# asp .net core webapi

看别的up说这个第一条报错是因为:后端没有允许跨域导致的

解决办法:

1.在后端添加允许跨域

Program.cs

cs 复制代码
 //添加跨域策略
 builder.Services.AddCors(options =>
 {
     options.AddPolicy("CorsPolicy", opt => opt.AllowAnyOrigin().AllowAnyHeader().AllowAnyMethod().WithExposedHeaders("X-Pagination"));
 });
cs 复制代码
 //使用跨域策略
 app.UseCors("CorsPolicy");

2.在前端配置代理

vite.config.ts

javascript 复制代码
  // 代理配置
  server:{
    proxy:{
       '/api':{
           target:"http://localhost:7137/api", //跨域地址
           changeOrigin:true, //支持跨域
           ws:true,
           rewrite:(path) => path.replace(/^\/api/, "")//重写路径,替换/api
       }
    }
 }

举例:调用后端接口 http://localhost:7137/api/User/GetUser

ok了,接口调用成功 ~

感谢up的高质量笔记

VS2022 .net6 WebApi 跨域处理,vscode vue 页面跨域处理_.net6 跨域-CSDN博客

相关推荐
夏梦春蝉3 分钟前
ES6从入门到精通:常用知识点
前端·javascript·es6
归于尽9 分钟前
useEffect玩转React Hooks生命周期
前端·react.js
G等你下课11 分钟前
React useEffect 详解与运用
前端·react.js
我想说一句12 分钟前
当饼干遇上代码:一场HTTP与Cookie的奇幻漂流 🍪🌊
前端·javascript
funnycoffee12312 分钟前
Huawei 6730 Switch software upgrade example版本升级
java·前端·华为
小鱼小鱼干15 分钟前
【Tauri】Tauri中Channel的使用
前端
拾光拾趣录17 分钟前
CSS全面指南:从基础布局到高级技巧与实践
前端·css
唐青枫17 分钟前
C#.NET log4net 详解
c#·.net
南屿im20 分钟前
基于 Promise 封装 Ajax 请求:从 XMLHttpRequest 到现代化异步处理
前端·javascript
青松学前端21 分钟前
vue-2.7源码解读之初始化流程和响应式实现
前端·vue.js·前端框架