Aspnet Mvc 前后端分离项目手记(一) 关于跨域问题(还有前言)
前言,最近的项目使用前后端分离的模式,记录其中一些知识点。经过这个项目,也对前后端分离有了更多理解,尤其是在技术之外的方面。
越来越多的项目采用前后端分离的原因,有两点:
1,技术方面的原因:移动端的越来越重要,一个项目可能要做好几种版本,手机端,app,pc...,,前端完全负责页面展示后端只负责统一的api; react,vue,ng一些优秀框架的产生,解决了很多前端开发者的痛点;还有一些随之而来的成熟框架elementui,iview等等。
2 ,非技术方面的原因 能做全栈的开发者相对还是比较少的,人们期望这种新的模式能够让责任分离,让前后端能够专注于做擅长的事情;还有就是,人们对新技术总是热情满满 ,乐于尝试。
当然也带来很多问题,比如前后端的联调和沟通,一些细节的划分。个人觉得,在开发效率上来讲,并没有明显的提高,当然了技术没有最好最坏,只有最合适。
(一) 关于跨域问题
跨域的全名叫浏览器同源策略。主要是为的防止一些安全性问题。具体的介绍跨域的文章有太多,这里就不再重复了。
注意,只有在浏览器中才会产生跨域,使用后端代码或者别的代理方式请求时,是不存在跨域的。
常见的解决办法有jsonp,或者通过iframe子窗体,使用代理。 今天我们要说的是最主流的解决办法:使用cors
在 localhost:52818的页面中请求 localhost:8080的接口
会出现这个
解决办法:找到web.config
<system.webServer>节点下面加入
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="accept" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE" />
</customHeaders>
</httpProtocol>
再次请求,我们发现没有跨域的问题了
问题还没有完,我们经常会在请求时带上身份认证的东西,比如说token。很多时候是带在请求头里面的,像这样
结果会出现这个,他的意思是token不允许出现在请求头里面
解决办法
还是web.config,加上这个就行
测试可以看到,问题解决了,也不会出现限制token了,但是会发现另一个问题,一个请求怎么变成两个了?
会发现,多了一个option请求
option请求又叫嗅探请求
产生的条件有两个,一,跨域。二请求头header中有自定义的,超出默认范围的字段,比如说刚才我们使用的token
下面是默认的请求头的范围
解决办法发:options请求时无法避免的。但是我们可以让他缓存在浏览器,尽量产生更少的options请求
在刚才的配置中再加上 <add name="Access-Control-Max-Age" value="86400" /> ,意思是让他缓存在浏览器86400秒
再次试验,可以发现第一次还存在options请求,后面就没了
相同的,后端也需要对options请求做处理:使用httpModule拦截options请求,并返回空字符串
添加完httpModule后一定要在web.config里面配置,才能注册到IIS
配置方法,找到Module节点,加入 <add name="MOptions" type="Site1.Filter.MOptions, Site1" /> ,也就是<add name="类名" type="类全名, 命名空间名" /> ,
这样,跨域问题就算完成了,
下一篇将会聊一下前后端分离时的token认证
转载于:https://www.cnblogs.com/wahson2019/p/10860794.html
Aspnet Mvc 前后端分离项目手记(一) 关于跨域问题(还有前言)相关推荐
- 前后端分离项目如何部署_前后端分离项目,如何解决跨域问题?
跨域资源共享(CORS)是前后端分离项目很常见的问题,本文主要介绍当SpringBoot应用整合SpringSecurity以后如何解决该问题. 01 什么是跨域问题? CORS全称Cross-Ori ...
- 前后端分离项目,如何解决跨域问题?
跨域问题是前后端分离项目中非常常见的一个问题,举例来说,编程猫(codingmore)学习网站的前端服务跑在 8080 端口下,后端服务跑在 9002 端口下,那么前端在请求后端接口的时候就会出现跨域 ...
- 前后端分离开发时候遇到的跨域访问问题
在前后端分离开发的时候,经常会遇到后端自己能调通接口,使用postman等测试工具访问也没有问题,但是在页面请求的时候会出现跨域访问问题: No 'Access-Control-Allow-Origi ...
- 前后端分离后解决微信授权跨域、微信H5授权登录跨域的问题解决
前言: 我们之前做的微信授权登录流程是: 1.第一步:用同意授权,并获取code 2.第二步:通过code换取网页授权access_token 3.第三步:刷新access_token(如果需要) 4 ...
- Spring Boot笔记-解决前后端分离在开发时的跨域问题
这里可以用Nginx解决跨越问题,也可以用下面这种方式在开发时解决: @Configuration public class CorsConfig implements WebMvcConfigure ...
- B站云E办Vue+SpringBoot前后端分离项目——MVC三层架构搭建后台项目
本项目来源B站云E办,笔记整理了项目搭建的过程和涉及的知识点.对于学习来说,不是复制粘贴代码即可,要知其然知其所以然.希望我的笔记能为大家提供思路,也欢迎各位伙伴的指正. 项目前端学习笔记目录 B站云 ...
- 【Docker】1、 前后端分离项目 下载启动运行
人人开源前后端分离项目下载与配置 文章目录 人人开源前后端分离项目下载与配置 前后端分离框架介绍 后端项目下载与配置 1.renren-fast后台项目介绍 2.开发环境搭建 3.下载后端renren ...
- 七个开源的 SpringBoot 前后端分离项目,Star过千,快去收藏夹吃灰吧!
点击上方蓝色"方志朋",选择"设为星标" 回复"666"获取独家整理的学习资料! 微信公众号:江南一点雨 前后端分离已经在慢慢走进各公司的技 ...
- sm4 前后端 加密_这7个开源的Spring Boot前后端分离项目整理给你
来源|公众号:江南一点雨 前后端分离已经开始逐渐走进各公司的技术栈,不少公司都已经切换到前后端分离开发技术栈上面了,因此建议技术人学习前后端分离开发以提升自身优势.同时,也整理了 7 个开源的 Spr ...
- 前后端分离项目_七个开源的 Spring Boot 前后端分离项目,一定要收藏
来自公众号:江南一点雨 前后端分离已经在慢慢走进各公司的技术栈,根据松哥了解到的消息,不少公司都已经切换到这个技术栈上面了.即使贵司目前没有切换到这个技术栈上面,松哥也非常建议大家学习一下前后端分离开 ...
最新文章
- Linux下的阻塞(Block)
- 30分钟正则表达式入门。
- linux升级Python2.7.12
- jQuery中 :first 和 :last 选择器诡异问题
- nagios监控-多用户管理
- Zookeeper环境安装
- segnet 编译与测试
- Netty实例-简单的服务端-client实现,凝视具体
- LeetCode872. Leaf-Similar Trees
- EmptyPage(空白页组件)原理与使用
- ajax send()的作用_AJAX(Asynchronous JavaScript And XML)
- DEA博弈交叉效率matlab,基于DEA/AR博弈交叉效率方法的学术期刊评价研究
- 2022凯立德导航懒人包完整版(地图包)绝对可以用
- doc 转换pdf swf
- 鸿蒙比安卓流畅,华为鸿蒙系统首升用户体验:流畅得不像话,专属应用体积超小!...
- stm32 GPIO_Write
- python调用程序call_Python调用外部程序——os.system()和subprocess.call()
- 系统测试常见类型及说明
- 马云曾经偶像,终于把阿里留下的 1400 亿败光了
- 【解决】长虹电视连接不上WiFi