***针对的是不同域名、不同协议的跨域:

1、找到config文件中开发环境的配置文件——dev.env.js,在里面将要跨域的域名配置进去

2、找到config文件中线上环境的配置文件——prod.env.js,在里面将要跨域的域名配置进

3、配置完后,还需要在config的index.js中配置对外的跨域域名,target的值为要跨域的域名(其他文件才能正常找到这个域名)

注:^api 默认替代了你要跨域的接口的域名

所以,在调用跨域接口的地方,跨域直接以 /api/***的形式去访问

这个时候,还会出现一个问题,明明写的是post的方法,但是为猫会被浏览器解析为OPTIONS

说到底,是这个跨域的问题没有彻底解决,还有一个顽症待治理

简单的说,就是“非简单请求”在跨域时,浏览器会默认自动帮你发一个OPTIONS请求,到服务器端请求服务器确认该请求的合法性,服务器端必须得有相应的路由处理该请求,并认真返回200响应,然后浏览器才会再次发出正常的、你需要的请求。

这个你可以和你们的后端商量,当然,如果后端大哥说会影响网站安全性这个问题,你也可以自己判断,降低请求复杂程度,将“复杂请求”降至“简单请求”

找到接口的拦截器部分,加上url的判断,不是本服务器上的域名,就降级(我的就一个跨域的域名,所以用的是==判断的)

这是我处理的方法,百度借鉴,但是一步一步走下来,另有收货,希望对有需要的人有帮助

vue——前端跨域的更多相关文章

  1. 如何实现vue前端跨域,proxyTable解决开发环境前端跨域问题

    在开发环境与后端调试的时候难免会遇到跨域问题,很多人说跨域交给后端解决就好了. 其实不然,前端也有很多方法可以解决跨域,方便也快捷. 常见的有nginx转发.node代理. 在vue项目中常用的是pr ...

  2. 解决vue+springboot前后端分离项目,前端跨域访问sessionID不一致导致的session为null问题

    问题: 前端跨域访问后端接口, 在浏览器的安全策略下默认是不携带cookie的, 所以每次请求都开启了一次新的会话. 在后台打印sessionID我们会发现, 每次请求的sessionID都是不同的, ...

  3. 搞懂:前端跨域问题JS解决跨域问题VUE代理解决跨域问题原理

    什么是跨域 跨域:一个域下的文档或脚本试图去请求另一个域下的资源 广义的跨域包含一下内容: 1.资源跳转(链接跳转,重定向跳转,表单提交) 2.资源请求(内部的引用,脚本script,图片img,fr ...

  4. vue 解决axios请求出现前端跨域问题

    vue 解决axios请求出现前端跨域问题 最近在写纯前端的vue项目的时候,碰到了axios请求本机的资源的时候,出现了访问报404的问题.这就让我很难受.查询了资料原来是跨域的问题. 在正常开发中 ...

  5. vue解决跨域问题

    vue解决跨域问题 vue跨域解决方法和小总结 vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow ...

  6. VUE006. 前端跨域代理服务器ProxyTable概述与配置

    概述 使用  vue-cli  工具生成一个  vue  项目: vue init webpack my-project-vue 在生成的项目结构里,会有一个  index.js  文件.在这个文件里 ...

  7. 前端跨域(二):JSONP

    上一篇文章 前端跨域(一):CORS 实现了跨域的一种解决方案,IE8 和其他浏览器分别通过 XDomainRequest 和 XHR 对象原生支持 CORS.这次我将补一补 Web 服务中也非常流行 ...

  8. 前端跨域(一):CORS

    上周做了一个移动端表单提交的页面,其中涉及到了跨域问题,想来也是惭愧,因为之前一直都没有遇到过这个问题,因此都没有深入探索过,只是知道有哪几种方式,这次终于借这个机会可以把遗留的知识点补一补了. 1. ...

  9. JAVA解决前端跨域问题。

    什么是跨域? 通俗来说,跨域按照我自己的想法来理解,是不同的域名之间的访问,就是跨域.不同浏览器,在对js文件进行解析是不同的,浏览器会默认阻止,所以 现在我来说下用java代码解决前端跨域问题. 用 ...

随机推荐

  1. 松软科技课堂:SQL之NOTNULL约束

    SQL NOT NULL 约束 NOT NULL 约束强制列不接受 NULL 值. NOT NULL 约束强制字段始终包含值.这意味着,如果不向字段添加值,就无法插入新记录或者更新记录. 下面的 SQ ...

  2. 从原理到场景 系统讲解 PHP 缓存技术

    第1章课程介绍 此为PHP相关缓存技术的课堂,有哪些主流的缓存技术可以被使用? 第1章 课程介绍 1-1课程介绍1-2布置缓存的目的1-3合理使用缓存1-4哪些环节适合用缓存 第2章 文件类缓存 2- ...

  3. ZFNet(2013)及可视化的开端

    目录 写在前面 网络架构与动机 特征可视化 其他 参考 博客:blog.shinelee.me | 博客园 | CSDN 写在前面 ZFNet出自论文< Visualizing and Unde ...

  4. Spring Boot核心(基本配置)

    上一篇Spring Boot我们简单讲了如何快速创建一个SpringBoot项目. 大家都知道SpringBoot非常强大,可以轻松与各种工具集成,但是我们知其然,也必须知其所以然. 今天开始就和大家 ...

  5. RDDs之combineByKey()

    combineByKey(crateCombiner,mergeValue,mergeCombiners,partitioner) 最常用的基于Key的聚合函数,返回的类型可以和输入的类型不一样 许多 ...

  6. 使用git在github远程仓库中操作

    在github上创建一个仓库,这一步参考廖雪峰老师的git教程,以及其他的一些准备工作略,我只记录几个重要的命令. 从其他github地址克隆项目 $ git clone git@github.com ...

  7. adb命令整理(持续整理)

    用到过的adb命令都整理下来,省的一直百度,还不一定能找到合适的答案 获得正在运行app的包名 :adb shell dumpsys window | findstr mCurrentFocus 1. ...

  8. Pytorch-数学运算

    引言 本篇介绍tensor的数学运算. 基本运算 add/minus/multiply/divide matmul pow sqrt/rsqrt round 基础运算 可以使用 + - * / 推荐 ...

  9. 导出 mysql 数据到 redis

    决定你要导入到 redis 的数据类型 假设我的表 t_user 的结构为 列名 注释 类型 name 名称 varchar idcard 身份证号 varchar phone 手机号 varchar ...

  10. Redis-->windows上的安装教程

    Windows下安装Redis服务 说明:本文拷贝自http://www.cnblogs.com/jaign/articles/7920588.html Redis是有名的NoSql数据库,一般Lin ...