vue——前端跨域
***针对的是不同域名、不同协议的跨域:
1、找到config文件中开发环境的配置文件——dev.env.js,在里面将要跨域的域名配置进去
2、找到config文件中线上环境的配置文件——prod.env.js,在里面将要跨域的域名配置进
3、配置完后,还需要在config的index.js中配置对外的跨域域名,target的值为要跨域的域名(其他文件才能正常找到这个域名)
注:^api 默认替代了你要跨域的接口的域名
所以,在调用跨域接口的地方,跨域直接以 /api/***的形式去访问
这个时候,还会出现一个问题,明明写的是post的方法,但是为猫会被浏览器解析为OPTIONS
说到底,是这个跨域的问题没有彻底解决,还有一个顽症待治理
简单的说,就是“非简单请求”在跨域时,浏览器会默认自动帮你发一个OPTIONS请求,到服务器端请求服务器确认该请求的合法性,服务器端必须得有相应的路由处理该请求,并认真返回200响应,然后浏览器才会再次发出正常的、你需要的请求。
这个你可以和你们的后端商量,当然,如果后端大哥说会影响网站安全性这个问题,你也可以自己判断,降低请求复杂程度,将“复杂请求”降至“简单请求”
找到接口的拦截器部分,加上url的判断,不是本服务器上的域名,就降级(我的就一个跨域的域名,所以用的是==判断的)
这是我处理的方法,百度借鉴,但是一步一步走下来,另有收货,希望对有需要的人有帮助
vue——前端跨域的更多相关文章
- 如何实现vue前端跨域,proxyTable解决开发环境前端跨域问题
在开发环境与后端调试的时候难免会遇到跨域问题,很多人说跨域交给后端解决就好了. 其实不然,前端也有很多方法可以解决跨域,方便也快捷. 常见的有nginx转发.node代理. 在vue项目中常用的是pr ...
- 解决vue+springboot前后端分离项目,前端跨域访问sessionID不一致导致的session为null问题
问题: 前端跨域访问后端接口, 在浏览器的安全策略下默认是不携带cookie的, 所以每次请求都开启了一次新的会话. 在后台打印sessionID我们会发现, 每次请求的sessionID都是不同的, ...
- 搞懂:前端跨域问题JS解决跨域问题VUE代理解决跨域问题原理
什么是跨域 跨域:一个域下的文档或脚本试图去请求另一个域下的资源 广义的跨域包含一下内容: 1.资源跳转(链接跳转,重定向跳转,表单提交) 2.资源请求(内部的引用,脚本script,图片img,fr ...
- vue 解决axios请求出现前端跨域问题
vue 解决axios请求出现前端跨域问题 最近在写纯前端的vue项目的时候,碰到了axios请求本机的资源的时候,出现了访问报404的问题.这就让我很难受.查询了资料原来是跨域的问题. 在正常开发中 ...
- vue解决跨域问题
vue解决跨域问题 vue跨域解决方法和小总结 vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow ...
- VUE006. 前端跨域代理服务器ProxyTable概述与配置
概述 使用 vue-cli 工具生成一个 vue 项目: vue init webpack my-project-vue 在生成的项目结构里,会有一个 index.js 文件.在这个文件里 ...
- 前端跨域(二):JSONP
上一篇文章 前端跨域(一):CORS 实现了跨域的一种解决方案,IE8 和其他浏览器分别通过 XDomainRequest 和 XHR 对象原生支持 CORS.这次我将补一补 Web 服务中也非常流行 ...
- 前端跨域(一):CORS
上周做了一个移动端表单提交的页面,其中涉及到了跨域问题,想来也是惭愧,因为之前一直都没有遇到过这个问题,因此都没有深入探索过,只是知道有哪几种方式,这次终于借这个机会可以把遗留的知识点补一补了. 1. ...
- JAVA解决前端跨域问题。
什么是跨域? 通俗来说,跨域按照我自己的想法来理解,是不同的域名之间的访问,就是跨域.不同浏览器,在对js文件进行解析是不同的,浏览器会默认阻止,所以 现在我来说下用java代码解决前端跨域问题. 用 ...
随机推荐
- Python Api接口自动化测试框架 excel篇
工作原理: 测试用例在excel上编辑,使用第三方库xlrd,读取表格sheet和内容,sheetName对应模块名,Jenkins集成服务发现服务moduleName查找对应表单,运用第三方库req ...
- 01 (OC)* @property 后面可以有哪些修饰符?
一:@property 后面可以有哪些修饰符? 1:线程安全的: atomic,nonatomic 2:访问权限的 readonly,readwrite 3:内存管理(ARC) assign, cop ...
- 14 (OC)* UIView和UILayer
总接来说就是如下几点: 1:每个 UIView 内部都有一个 CALayer 在背后提供内容的绘制和显示,并且 UIView 的尺寸样式都由内部的 Layer 所提供.两者都有树状层级结构,layer ...
- [Python] 09 - Multi-processing
前言 资源 Ref: Python3 多线程 Ref: Python3之多进程 # python中的多线程无法利用多核优势 更多的提高效率的策略,请参见:[Pandas] 01 - A g ...
- JavaScript阻止冒泡事件
事件兼容 event = event ? event : window.event; js停止冒泡· window.event? window.event.cancelBubble = true : ...
- DefaultSerializer requires a Serializable payload but received an object of type [model.Admin]
一.问题描述: 在用redis做二级缓存时,出现如下异常 DefaultSerializer requires a Serializable payload but received an o ...
- Docker下实战zabbix三部曲之二:监控其他机器
在上一章<Docker下实战zabbix三部曲之一:极速体验>中,我们快速安装了zabbix server,并登录管理页面查看了zabbix server所在机器的监控信息,但是在实际场景 ...
- LoadRuuner资源监控
用ipconfig命令查看IP地址的具体方法.初级工程师面试常面临的问题:网址:http://url.cn/5BaDWvB本机IP:172.0.0.1localhostipconfig命令c查看本机I ...
- spring cache常用注解使用
1.@CacheConfig 主要用于配置该类中会用到的一些共用的缓存配置.示例: @CacheConfig(cacheNames = "users") public interf ...
- .Net Core 商城微服务项目系列(九):使用Jenkins构建自动发布
1.首先通过Docker运行Consul,并保证各个服务都成功注册: 然后运行jenkins,对MI.Web项目进行发布构建,至于怎么配置之前已经写过了,和上一篇一模一样,这里贴下批处理命令: cd ...