CORS跨域问题解决
.NET
var builder = WebApplication.CreateBuilder(args); // Add services to the container. builder.Services.AddControllers(); // Learn more about configuring Swagger/OpenAPI at https://aka.ms/aspnetcore/swashbuckle builder.Services.AddEndpointsApiExplorer(); builder.Services.AddSwaggerGen(); //添加跨域策略1 builder.Services.AddCors(opts => { opts.AddPolicy("Cros", opt => opt.AllowAnyOrigin() .AllowAnyHeader() .WithExposedHeaders("X-Pagination")); }); var app = builder.Build(); // Configure the HTTP request pipeline. if (app.Environment.IsDevelopment()) { app.UseSwagger(); app.UseSwaggerUI(); } app.UseAuthorization(); app.MapControllers(); //使用跨域策略2 app.UseCors("Cros"); app.Run();
VUE前端(代理)
找到vue.config.js
const { defineConfig } = require('@vue/cli-service') module.exports = defineConfig({ transpileDependencies: true, //代理 devServer:{ proxy:{ '/api':{ target:'http://localhost:5041/api', //允许跨域 changeOrigin:true, ws:true, pathRewrite:{ '^/api':"" } } } } })
需要重启程序!
import axios from "axios"; import {ref} from "vue"; const json=ref("/json"); const http=ref("/api"); export const getImage=()=>{ return axios.get(http.value+"/Image/GetImage"); }