netcore5下js请求跨域
后端代码如下:
using Microsoft.AspNetCore.Mvc;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks; // For more information on enabling Web API for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860 namespace WebApplication.Controllers
{
[Route("api/[controller]")]
[ApiController]
public class ValuesController : ControllerBase
{
// GET: api/<ValuesController>
[HttpGet]
public IEnumerable<string> Get()
{
return new string[] { "value1", "value2" };
} // GET api/<ValuesController>/5
[HttpGet("{id}")]
public string Get(int id)
{
return "value";
} // POST api/<ValuesController>
[HttpPost]
public void Post([FromForm] string value) //FromBody须改成FromFrom要不然跨域还是会报错
{
} // PUT api/<ValuesController>/5
[HttpPut("{id}")]
public void Put(int id, [FromBody] string value)
{
} // DELETE api/<ValuesController>/5
[HttpDelete("{id}")]
public void Delete(int id)
{
}
}
}
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.HttpsPolicy;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Hosting;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks; namespace WebApplication
{
public class Startup
{
readonly string MyAllowSpecificOrigins = "_myAllowSpecificOrigins"; public Startup(IConfiguration configuration)
{
Configuration = configuration;
} public IConfiguration Configuration { get; } // This method gets called by the runtime. Use this method to add services to the container.
public void ConfigureServices(IServiceCollection services)
{
services.AddCors(options =>
{
options.AddPolicy(name: MyAllowSpecificOrigins,
builder =>
{
builder.WithMethods("get", "post").AllowAnyOrigin();//允许任何来源的主机访问 });
}); services.AddControllersWithViews();
} // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
else
{
app.UseExceptionHandler("/Home/Error");
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseStaticFiles(); app.UseRouting(); app.UseAuthorization();
app.UseCors(MyAllowSpecificOrigins);
app.UseEndpoints(endpoints =>
{
endpoints.MapControllerRoute(
name: "default",
pattern: "{controller=Home}/{action=Index}/{id?}");
});
}
}
}
前端就是一个测试demo，代码如下：
<HTML>
<HEAD></HEAD>
<script charset="utf-8">
function createCORSRequest(method,url){
var xhr = new XMLHttpRequest();
if("withCredentials" in xhr){
xhr.open(method,url,true);
}else if(typeof XDomainRequest !="undifined"){
xhr = new XDomainRequest();
xhr.open(method,url);
}else
{
xhr=null;
}
return xhr;
} //get请求 <!-- var request = createCORSRequest("get","https://localhost:44351/api/values"); -->
<!-- if(request){ --> <!-- request.onload=function(){ -->
<!-- alert(request.responseText); -->
<!-- }; -->
<!-- request.send(); -->
<!-- } -->
//post请求
<!-- var request = createCORSRequest("post","https://localhost:44351/api/values"); -->
<!-- if(request){ --> <!-- //request.withCredentials = "true"; //客户端设置跨域即可，前端不能设置，如果设置反而报错 -->
<!-- //request.setRequestHeader('Access-Control-Allow-Origin','*'); -->
<!-- //request.setRequestHeader('Content-Type','application/json'); -->
<!-- //request.setRequestHeader('Origin','localhost:44351'); -->
<!-- request.onload=function(){ -->
<!-- alert(request.responseText); -->
<!-- }; -->
<!-- request.send("hello world!"); -->
<!-- } -->
</script>
<BODY> <div id="i">
test
</div>
</BODY>
</HTML>
netcore5下js请求跨域的更多相关文章
- js&jquery跨域详解jsonp，jquery并发大量请求丢失回调bug
URL 说明 是否允许通信 http://www.a.com/a.js http://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.js http:/ ...
- JS JSOP跨域请求实例详解
JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题.这篇文章主要介绍了JS JSOP跨域请求实例详解的相关资料,需要的朋友可以参考下 ...
- js执行跨域请求
//js执行跨域请求 var _script = document.createElement('script'); _script.type = "text/javascript" ...
- easy ui Tree请求跨域数据
扯淡篇: jQuery EasyUI为提供了大多数UI控件的使用,如:accordion,combobox,menu,dialog,tabs,validatebox,datagrid,window,t ...
- day78_淘淘商城项目_11_单点登录系统实现 + 用户名回显 + ajax请求跨域问题详解_匠心笔记
课程计划 1.SSO注册功能实现 2.SSO登录功能实现 3.通过token获得用户信息 4.ajax跨域请求解决方案--jsonp 1.服务接口实现 SSO系统就是解决分布式环境下登录问题的,本 ...
- 百万年薪python之路 -- 请求跨域和CORS协议详解
楔子 什么是同源策略 同源策略,它是由Netscape提出的一个著名的安全策略.现在所有支持JavaScript 的浏览器都会使用这个策略.所谓同源是指,域名,协议,端口相同.当一个浏览器的两个tab ...
- 关于vue-cli3中配置请求跨域的问题
关于vue-cli3中配置请求跨域的问题 根据Vue CLI3官方文档, 需要在vue.config.js文件中配置devServer.proxy选项来解决跨域问题. 关于vue.config.js文 ...
- http请求跨域问题分析
http请求跨域问题分析 个人认为可能涉及很多http的知识,本人才疏学浅不敢妄自揣测,只是做个笔记为了以后对比理解,从原生fetch说起吧,前提假设有个后端服务,我用express来模拟,如下: v ...
- js调用跨域
web aapi 初体验 解决js调用跨域问题 跨域界定 常见跨域: 同IP不同端口: http:IP:8001/api/user http:IP:8002/api/user 不同IP不同 ...
- Vue(项目踩坑)_解决vue中axios请求跨域的问题
一.前言 今天在做项目的时候发现axios不能请求跨域接口 二.主要内容 1.之前直接用get方式请求聚合数据里的接口报错如下 2.当前请求的代码 3.解决方法 (1)在项目目录中依次找到:confi ...
随机推荐
- C# 单例模式使用 Singleton
Singleton 类如下: public class Singleton<T> where T : class, new() { private static T _instance; ...
- Win10 如何在桌面显示我的电脑
Win10桌面右键鼠标,然后在弹出来的选项中选择个性化. 选择了个性化后会弹出设置界面,在设置中选择[主题] 找到[桌面图标设置] 点击[桌面图标设置],会弹出一个对话框,该对话框有可以设置显示的图标 ...
- Tarjan 算法——图论学习笔记
Part.1 引入 在图论问题中,我们经常去研究一些连通性问题,比如: 有向图的联通性:传递闭包--Floyd 算法: 有向图连通性的对称性:强联通分量(SCC)--Tarjan 算法缩点: 无向图的 ...
- 基于IDEA javaweb项目目录结构
https://www.pianshen.com/article/62631355687/
- k-均值聚类算法 Primary
目录 案例--区分好坏苹果(有Key) 案例--自动聚类(无Key) k-均值聚类算法(英文:k-means clustering) 定义: k-均值聚类算法的目的是:把n个点(可以是样本的一次观察或 ...
- JDK14性能管理工具:jstack使用介绍
目录 简介 jstack的命令格式 jstack的使用 总结 简介 在之前的文章中,我们介绍了JDK14中jstat工具的使用,本文我们再深入探讨一下jstack工具的使用. jstack工具主要用来 ...
- OpenHarmony定义组件重用样式：@Styles装饰器
如果每个组件的样式都需要单独设置,在开发过程中会出现大量代码在进行重复样式设置,虽然可以复制粘贴,但为了代码简洁性和后续方便维护,我们推出了可以提炼公共样式进行复用的装饰器@Styles. @St ...
- 【版本发布公告】HMS Core6.5.0来啦
新 能 力 3D Engine 3D Engine提供高性能.高画质.高扩展性的实时3D引擎,并提供便捷高效的可视化开发工具.开发者可基于华为的3D Studio开发工具,通过图形和渲染.动画.UI等 ...
- 开始学习web-sql注入
web内容多且杂,不知道怎么下手开始学,那就先从sql注入开始学吧 目前只在b站上找了一些课程,还有ctfwiki作为参考 链接贴在下面: ctfwiki https://www.bilibili.c ...
- 4天带你上手HarmonyOS ArkUI开发——《HarmonyOS ArkUI入门训练营之健康生活实战》
<HarmonyOS ArkUI入门训练营之健康饮食应用>是面向入门开发者打造的实战课程系列.特邀华为终端BG高级开发工程师作为本次训练营讲师,以健康饮食为例,开展技术教学及实战案例分享 ...