通过这种方法也可以解决跨域的问题。

使用http-proxy-middleware 代理解决(项目使用vue-cli脚手架搭建)

例如请求的url:“http://f.apiplus.cn/bj11x5.json

1、打开config/index.js,在proxyTable中添写如下代码:

1
2
3
4
5
6
7
8
9
proxyTable: { 
  '/api': {  //使用"/api"来代替"http://f.apiplus.c" 
    target: 'http://f.apiplus.cn', //源地址 
    changeOrigin: true, //改变源 
    pathRewrite: { 
      '^/api': 'http://f.apiplus.cn' //路径重写 
      
  
}

2、使用axios请求数据时直接使用“/api”:

通过这中方法去解决跨域,打包部署时还按这种方法会出问题。解决方法如下:

vue+axios跨域解决方法的更多相关文章

  1. [转]vue跨域解决方法

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

  2. JavaScript跨域解决方法大全

    跨域的定义:JavaScript出于安全性考虑,同源策略机制对跨域访问做了限制.域仅仅是通过“URL的首部”字符串进行识别,“URL的首部”指window.location.protocol +win ...

  3. vue跨域解决方法 及设置api路径方法

    vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow-Origin' header is prese ...

  4. vue跨域解决方法

    针对不在同一服务器,很可能出现跨域问题,解决方法 注意:修改了配置文件,需要重启才能生效

  5. vue axios跨域

    现在应用都是前后端分离,这也造成前端在调用接口时出现跨域问题,在控制台会这样提示 ,如果有类似于此图的提示,就已经表明你的接口调用出现了跨域问题,此文章是我对于vue跨域其中一种方式的一些经验,如果错 ...

  6. VUE AXIOS 跨域问题

    背景: 后台跨域使用通配符:context.Response.Headers.Add("Access-Control-Allow-Origin", "*"); ...

  7. Nuxt使用axios跨域问题解决方法

    Nuxt 是 Vue 项目服务器端渲染(SSR)解决方案.而在使用时,就会遇到前后端分离情况下的域名或端口不一致导致的跨域问题.本文将介绍如何通过设置代理解决 Nuxt 与 axios 集成的跨域问题 ...

  8. ajax原理和跨域解决方法

    ajax是异步的 JavaScript 和 XML.通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. 1--启动 ...

  9. WCF跨域解决方法及一些零碎的东西。

    之前发过一篇随笔,说的WCF配置文件配置问题.里面也配了跨域支持,但是jsoncollback只支持Get请求,Post请求是解决不了,所以这里把真正的WCF跨域问题贴出来. 话不多说,直接帖配置文件 ...

随机推荐

  1. Python实现简单的四则运算

    GitHub 项目地址 https://github.com/745421831/-/tree/master PSP PSP2.1 Personal Software Process Stages 预 ...

  2. springboot based 主从数据源中间件方案

    先定几个原则/目标: 原则: 1.必须保证数据逻辑的一致性: 反例:刚写了数据,(因为主从延迟)查询不到: 2.对开发人员透明,对业务代码无侵入性:与单数据源的业务代码调用一致: 反例:对已有业务代码 ...

  3. C# [Win32] [GDI+] [API] Load HFONT from Memory

    // gdiplusenums.h //-------------------------------------------------------------------------- // Fo ...

  4. 记-统计svn与git的log日志中的代码行变更

    任务要求 统计指定时间内,指定git地址与svn地址上的所有人员的代码行变更情况. 解决方案 最初为根据数据库中存储的所有git与svn地址来统计所有人员的提交代码行.之后由于库中存储的地址不全,改为 ...

  5. numpy数据集练习

    #1. 安装scipy,numpy,sklearn包 import numpy as np #2. 从sklearn包自带的数据集中读出鸢尾花数据集data from sklearn.datasets ...

  6. ImportError: No module named _tkinter, please install the python-tk package ubuntu运行tkinter错误

    这是由于Python的版本没有包含tkinter的模块,只需要把tk的package安装就可以了. 一般在Linux才出现,windows版本一般已经包含了tkinter模块. apt-get ins ...

  7. @Dependson注解与@ConditionalOnBean注解的区别

    @Dependson注解是在另外一个实例创建之后才创建当前实例,也就是,最终两个实例都会创建,只是顺序不一样 @ConditionalOnBean注解是只有当另外一个实例存在时,才创建,否则不创建,也 ...

  8. 将float数据类型转换为str

    示例程序: #include <stdio.h> . . void UART_send_byte(char dat); void UART_send_string(unsigned cha ...

  9. jmeter之服务器性能监测

    性能测试时,我们的关注点有两部分 1 服务本身:并发 响应时间 QPS 2 服务器的资源使用情况:cpu memory I/O disk等 JMeter的plugins插件可以实现对服务器资源使用情况 ...

  10. styled-components的基本使用

    一.官网地址 https://www.styled-components.com/ 二.styled-components 1.styled-components 样式化组件,主要作用是它可以编写实际 ...