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

环境:

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博客

相关推荐
小杨同学呀呀呀呀10 分钟前
Ant Design Vue <a-timeline>时间轴组件失效解决方案
前端·javascript·vue.js·typescript·anti-design-vue
小草cys1 小时前
在 openEuler 上安装 DDE 图形桌面环境(适用于华为鲲鹏服务器/PC)
运维·服务器
华玥作者8 小时前
[特殊字符] VitePress 对接 Algolia AI 问答(DocSearch + AI Search)完整实战(下)
前端·人工智能·ai
天才奇男子9 小时前
HAProxy高级功能全解析
linux·运维·服务器·微服务·云原生
.房东的猫9 小时前
ERP(金蝶云星空)开发【安装篇】
c#
Mr Xu_9 小时前
告别冗长 switch-case:Vue 项目中基于映射表的优雅路由数据匹配方案
前端·javascript·vue.js
前端摸鱼匠9 小时前
Vue 3 的toRefs保持响应性:讲解toRefs在解构响应式对象时的作用
前端·javascript·vue.js·前端框架·ecmascript
lang201509289 小时前
JSR-340 :高性能Web开发新标准
java·前端·servlet
❀͜͡傀儡师10 小时前
centos 7部署dns服务器
linux·服务器·centos·dns
好家伙VCC10 小时前
### WebRTC技术:实时通信的革新与实现####webRTC(Web Real-TimeComm
java·前端·python·webrtc