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

环境:

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

相关推荐
HPC_fac1305206781620 分钟前
以科学计算为切入点:剖析英伟达服务器过热难题
服务器·人工智能·深度学习·机器学习·计算机视觉·数据挖掘·gpu算力
yaoxin5211231 小时前
第二十七章 TCP 客户端 服务器通信 - 连接管理
服务器·网络·tcp/ip
学不会•1 小时前
css数据不固定情况下,循环加不同背景颜色
前端·javascript·html
活宝小娜4 小时前
vue不刷新浏览器更新页面的方法
前端·javascript·vue.js
程序视点4 小时前
【Vue3新工具】Pinia.js:提升开发效率,更轻量、更高效的状态管理方案!
前端·javascript·vue.js·typescript·vue·ecmascript
coldriversnow4 小时前
在Vue中,vue document.onkeydown 无效
前端·javascript·vue.js
我开心就好o4 小时前
uniapp点左上角返回键, 重复来回跳转的问题 解决方案
前端·javascript·uni-app
开心工作室_kaic5 小时前
ssm161基于web的资源共享平台的共享与开发+jsp(论文+源码)_kaic
java·开发语言·前端
刚刚好ā5 小时前
js作用域超全介绍--全局作用域、局部作用、块级作用域
前端·javascript·vue.js·vue
向宇it5 小时前
【unity小技巧】unity 什么是反射?反射的作用?反射的使用场景?反射的缺点?常用的反射操作?反射常见示例
开发语言·游戏·unity·c#·游戏引擎