【C#】使用vue3的axios发起get和post请求.net framework部署的API显示跨域

欢迎来到《小5讲堂》
这是《C#》系列文章,每篇文章将以博主理解的角度展开讲解。
温馨提示:博主能力有限,理解水平有限,若有不对之处望指正!

在这里插入图片描述

目录

  • 前言
  • 跨域提示
  • 解决方案
  • 现状
  • 跨域疑问
  • 跨域概念
  • 相关文章

前言

最近在对接.net framework 4.6.1部署的api接口,由于太久没有用这个框架了,
很多小细节都忘得差不多了,刚好趁这次遇到的问题进行简单记录下。
现在开发模式基本都是前后端分离,虽然C#和Java本身也有自己的前端页面,
但是目前出来的vue框架,极大帮助了在前端开发的效率和性能,拥抱变化吧!

跨域提示

因为vue运行起来的本地地址和端口都是独立的,所以和后端API接口的地址端口肯定是不一样。
所以就会出现下面跨域提示,也很明确提示Access=Control-Allow-Origin。
在这里插入图片描述
下面表示并没有运行表头authorization字段值的请求。
在这里插入图片描述

解决方案

在web.config文件增加下面代码即可,如果还有出现跨域,那么再具体查看错误提示,一般都是Headers表头设置多一点。

<system.webServer><!-- ... 其他配置 ... --><httpProtocol><customHeaders><!-- 允许跨域资源共享(CORS) --><add name="Access-Control-Allow-Origin" value="*" /><add name="Access-Control-Allow-Headers" value="Content-Type,Authorization" /><add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" /></customHeaders></httpProtocol><!-- ... 其他配置 ... --></system.webServer>

现状

前后端分离开发,一般会分为前端开发和后端开发,这就意味着需要前后端开发人员进行一定接口对接沟通,
这个时候出现最多的问题就是跨域问题,特别是本地调试,必然会出现不同访问地址和域名,互扯和纷争就开始了。
比如:我明明已经设置了跨域,别人可以,为什么你的不可以。
如何破局呢?不妨从下面这几个方面思考。

  • 前端
    1)前端解决跨域一般是通过设置本地代理。

  • 后端
    1)postman和APP都可以访问成功
    2)浏览器发起请求显示跨域
    3)确认是http还是https发起的请求
    备注:通过postman和APP发起的访问,属于工具请求,没有资源的相互方法,源头发起就是api接口本身。
    通过浏览器发起的请求属于源头属于浏览器本身运行地址,所以出现跨域。

在这里插入图片描述

跨域疑问

APP发起的请求和浏览器发起的请求一样吗,APP不会出现跨域,浏览器请求提示跨域,这是为什么呢?

跨域问题主要是由于浏览器的同源策略造成的。
同源策略是浏览器的一种安全机制,它要求域名、协议和端口三者完全相同,否则就会阻止跨域请求‌。
由于APP和小程序不属于浏览器环境,因此不受同源策略的限制,也就不会出现跨域问题‌。

在浏览器中,跨域问题主要体现在AJAX请求上。
当浏览器发起一个不同源的AJAX请求时,由于同源策略的限制,会阻止这些请求的成功执行,从而提示跨域错误‌。
然而,在APP和小程序中,由于不存在同源策略,所以不会出现跨域问题‌在这里插入图片描述

跨域概念

跨域通常指的是在编程和网络安全中,不同源(域名、协议或端口)之间的交互。

在Web开发中,跨域请求指的是浏览器在一个域中发送的请求,试图访问另一个域中的资源。
为了安全考虑,现代浏览器实施了同源策略(Same-Origin Policy),限制了一个来源的文档或脚本如何与另一个来源的资源进行交互。

这意味着在大多数情况下,如果你尝试通过AJAX、Fetch API或其他方式从一个域向另一个域发送请求,浏览器会阻止这种“跨域”请求。
然而,在实际应用中,跨域交互是必需的,例如,当你需要从不同的域加载数据或资源时。

为了解决这个问题,有几种常见的跨域解决方案:

1.JSONP(JSON with Padding):
一种利用

2.CORS(Cross-Origin Resource Sharing):
一种更为现代和灵活的跨域解决方案。通过服务器设置特定的HTTP头,允许浏览器跨域请求资源。CORS支持所有类型的HTTP请求。

3.代理服务器:
通过设置一个代理服务器,将客户端的请求转发到目标服务器,再将目标服务器的响应返回给客户端。这样,客户端和目标服务器之间的交互就通过代理服务器进行,从而避免了跨域问题。

跨域是Web开发中经常遇到的问题,了解并掌握跨域解决方案对于开发人员来说是非常重要的。

相关文章

【C#】使用vue3的axios发起get和post请求.net framework部署的API显示跨域

【C#】.net core 6.0 webapi 使用core版本的NPOI的Excel读取数据以及保存数据

【C#】pdf按页分割文件,以及分页合并,效果还不错,你值得拥有

【C#】未能加载文件或程序集“CefSharp.Core.Runtime.dll”或它的某一个依赖项。找不到指定的模块。

【C#】.net core 6.0 在program时间格式统一json格式化,并列举program默认写法和简化写法

【C#】.net core 6.0 ApiController,API控制器方法,API接口以实体类作为接收参数应该注意的点

【C#】 SortedDictionary,查找字典中是否存在给定的关键字

【C#】.net core 6.0 MVC返回JsonResult显示API接口返回值不可被JSON反序列化

【C#】.net core 6.0 使用第三方日志插件Log4net,配置文件详细说明

【C#】使用代码实现龙年春晚扑克牌魔术(守岁共此时),代码实现篇

【C#】使用代码实现龙年春晚扑克牌魔术(守岁共此时),流程描述篇

【C#】约瑟夫原理举例2个代码实现

【C#】List泛型数据集如何循环移动,最后一位移动到第一位,以此类推

【C#】获取文本中的链接,通过正则表达式的方法获取以及优化兼容多种格式

温故而知新,不同阶段重温知识点,会有不一样的认识和理解,博主将巩固一遍知识点,并以实践方式和大家分享,若能有所帮助和收获,这将是博主最大的创作动力和荣幸。也期待认识更多优秀新老博主。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/882265.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

React高级Hook

useReducer useReducer 是 React 提供的一个 Hook&#xff0c;用于在函数组件中使用 reducer 函数来管理组件的 state。它类似于 Redux 中的 reducer&#xff0c;但仅用于组件内部的状态管理。useReducer 可以使复杂的状态逻辑更加清晰和可维护。 基本用法 useReducer 接收…

Linux——网络层协议

前言 网络层&#xff1a;在复杂的网络环境中确定一个合适的路径 目录 前言 一IP协议 1预备知识 2基本概念 3格式 4网段划分 4.1理解IP 4.2IP组成 4.3划分方式 4.4为什么要网段划分 5特殊的IP地址 6IP地址的限制 7私有IP和公网IP 8NAT技术 9理解公网 10路由 …

[MySQL课后作业]人事管理系统的SQL实践

1.假设某商业集团中有若干公司&#xff0c;人事数据库中有3个基本表 职工表:EMP(E#.ENAME,AGE, SEX, ECITY)。 其属性分别表示职工工号、姓名、年龄、性别和居住城市。 工作表:WORKS(E#,C#,SALARY)。其属性分别表示职工工号、所在公司的编号和工资。 公司表:COMP(C#,CANME,CITY…

【优选算法篇】踏入算法的深邃乐章:滑动窗口的极致探秘

文章目录 C 滑动窗口详解&#xff1a;进阶题解与思维分析前言第二章&#xff1a;进阶挑战2.1 水果成篮解法一&#xff1a;滑动窗口解法二&#xff1a;滑动窗口 数组模拟哈希表复杂度分析&#xff1a;图解分析&#xff1a;示例&#xff1a;滑动窗口执行过程图解&#xff1a; 详…

C for Graphic:径向模糊

最近要做一系列特效需求&#xff0c;顺便记录一下。 径向模糊&#xff08;也叫辐射模糊&#xff09;&#xff1a;一种由内向外发散的模糊的效果 原理&#xff1a;获取中心点&#xff08;centeruv&#xff09;到当前像素&#xff08;pixeluv&#xff09;的朝向法向…

RFC2616 超文本传输协议 HTTP/1.1

一、URL-俗称“网址” HTTP 使用 URL(Uniform Resource Locator&#xff0c;统一资源定位符)来定位资源&#xff0c;它是 URI(Uniform Resource Identifier&#xff0c;统一资源标识符)的子集&#xff0c;URL 在 URI 的基础上增加了定位能力 URI 除了包含 URL&#xff0c;还包…

车载实操:一对一实操学习、CANoe实操学习、推荐就业机会、就业技术支持、协助面试辅导

FOTA模块中OTA的知识点&#xff1a;1.测试过程中发现哪几类问题&#xff1f; 可能就是一个单键的ecu&#xff0c;比如升了一个门的ecu&#xff0c;他的升了之后就关不上&#xff0c;还有就是升级组合ecu的时候&#xff0c;c屏上不显示进度条。 2.在做ota测试的过程中&#xff…

5G NR:UE初始接入信令流程浅介

UE初始接入信令流程 流程说明 用户设备&#xff08;UE&#xff09;向gNB-DU发送RRCSetupRequest消息。gNB-DU 包含 RRC 消息&#xff0c;如果 UE 被接纳&#xff0c;则在 INITIAL UL RRC MESSAGE TRANSFER 消息中包括为 UE 分配的低层配置&#xff0c;并将其传输到 gNB-CU。IN…

PFC和LLC的本质和为什么要用PFC和LLC电路原因

我们可以用电感和电容的特性,以及电压和电流之间的不同步原理来解释PFC(功率因数校正)和LLC(谐振变换器)。 电感和电容的基本概念 电感(Inductor): 电感是一种储存电能的组件。它的电流变化比较慢,电流在电感中延迟,而电压变化得比较快。可以把电感想象成一个“滞后…

『Mysql集群』Mysql高可用集群之主从复制 (一)

Mysql主从复制模式 主从复制有一主一从、主主复制、一主多从、多主一从等多种模式. 我们可以根据它们的优缺点选择适合自身企业情况的主从复制模式进行搭建 . 一主一从 主主复制 (互为主从模式): 实现Mysql多活部署 一主多从: 提高整个集群的读能力 多主一从: 提高整个集群的…

transformers 推理 Qwen2.5 等大模型技术细节详解(一)transformers 初始化和对象加载(文末免费送书)

上周收到一位网友的私信&#xff0c;希望老牛同学写一篇有关使用 transformers 框架推理大模型的技术细节的文章。 老牛同学刚开始以为这类的文章网上应该会有很多&#xff0c;于是想着百度几篇质量稍高一点的回复这位网友。结果&#xff0c;老牛同学搜索后发现&#xff0c;类…

信息与计算科学:“数学 + 计算机”,奏响未来科技新乐章

在当今科技飞速发展的时代&#xff0c;有一个专业如同一颗闪耀的新星&#xff0c;散发着独特的魅力&#xff0c;那就是信息与计算科学专业。 一、专业全貌&#xff1a;追根溯源&#xff0c;领略交叉之美 &#xff08;一&#xff09;专业的诞生与发展 1998 年&#xff0c;教育…

一图解千言,了解常见的流程图类型及其作用

在企业管理、软件研发过程中&#xff0c;经常会需要进行各种业务流程梳理&#xff0c;而流程图就是梳理业务时必要的手段&#xff0c;同时也是梳理的产出。但在不同的情况下适用的流程图又不尽相同。 本文我们就一起来总结一下8 种最常见的流程图类型 数据流程图 数据流程图&…

RHCE——例行性工作

准备工作 [rootlocalhost ~]# cat /etc/yum.repos.d/aliyun.repo [ali-app] nameali-app baseurlhttps://mirrors.aliyun.com/centos-stream/9-stream/AppStream/x86_64/os/ gpgcheck0[ali-base] nameali-base baseurlhttps://mirrors.aliyun.com/centos-stream/9-stream/Base…

JS | JS中类的 prototype 属性和__proto__属性

大多数浏览器的 ES5 实现之中&#xff0c;每一个对象都有__proto__属性&#xff0c;指向对应的构造函数的prototype属性。Class 作为构造函数的语法糖&#xff0c;同时有prototype属性和__proto__属性&#xff0c;因此同时存在两条继承链。 构造函数的子类有prototype属性。‌ …

倍福中控显示屏维修控制面板CP7732-1207-0030

使用的环境条件不当可能会损坏设备。 保护设备&#xff0c;防止灰尘、湿气和热量进入。 使用注意事项&#xff1a; 空气流通不畅 设备安装不正确会阻碍设备内的空气流通&#xff0c;从而导致过热和功能受损。 只能按所示方向将设备安装在相应的壁上。 该设备设计用于安装在…

05 P1157 组合的输出

题目&#xff1a; 代码&#xff1a; #include<iostream> using namespace std; # define M 500 #include<algorithm>int sa[100005],k,n,count1;bool func(int n) {int mark0;if(n1){return 1;}else{for(int i2;i<n-1;i){if(n%i0){mark1;return 0;}}if(mark0)r…

强化学习案例:美团是如何在推荐系统中落地强化学习

目录 美团的强化学习应用场景和分析 场景举例 使用原因 强化学习的六大要素 智能体 环境 行动 奖励 目标 状态 美团强化学习模型设计 美团强化学习工程落地 总体的数据结构关系图 实现步骤 1. 日志收集与实时处理&#xff08;Log Collector, Online Joiner&…

PyTorch 2.5 发布带来一些新特性和改进

官网&#xff1a;https://github.com/pytorch/pytorchGitHub&#xff1a;https://github.com/pytorch/pytorch原文&#xff1a;https://github.com/pytorch/pytorch/releases/tag/v2.5.0 主要亮点 (Highlights)] SDPA CuDNN 后端&#xff1a;为 torch.nn.functional.scaled_d…

C++标准模板库--vector

vector 介绍 vector&#xff08;向量&#xff09;是一种序列容器&#xff0c;表示为可以改变大小的数组。vector中的元素使用连续的存储位置&#xff0c;这意味着也可以使用指向其元素的常规指针偏移量来访问任意元素&#xff0c;且与数组一样高效。但与数组不同的是&#xff…