VUE是基于node.js，所以解决跨域问题，设置一下反向代理即可。

我这里要调用的第三方接口地址为 http://v.juhe.cn/toutiao/index?type=top&key=136c500303493492d6f855c6a62f48ee

找到项目的目录config > index.js 下面有个服务器配置dev 下面的 proxyTable：{}

然后在axios请求里改一下url

修改之后请求接口就不会再报 Access-Control-Allow-Origin此类跨域错误

 

VUE 使用axios请求第三方接口数据跨域问题解决的更多相关文章

  1. vue中Axios请求豆瓣API数据并展示到Swipe中

    vue中Axios请求豆瓣API数据并展示到Swipe中 1.首先是安装Axios: 安装方法cnpm install axios --save 等待npm安装完毕: 2.在main.js中引入axi ...

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

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

  3. 分别使用http,express,koa请求第三方接口

    今天又再次恶补了一下http的内容,确切地说是node.js里面的http的内容,啊,百度了半天express怎么请求第三方接口,结果发现自己买的入门书籍都有这个内容.舍近求远,我真是醉了.还有百度上 ...

  4. Vue解决接口访问跨域问题

    随手摘录 Vue解决接口访问跨域问题 1.打开 config -> index.js 2. 找到proxyTable 3.粘贴 如下代码,'https://www.baidu.com'换成要访问 ...

  5. 前端vue开发中的跨域问题解决，以及nginx上线部署。（vue devServer与nginx）

    前言 最近做的一个项目中使用了vue+springboot的前后端分离模式 在前端开发的的时候,使用vue cli3的devServer来解决跨域问题 上线部署则是用的nginx反向代理至后台服务所开 ...

  6. Vue+SpringBoot前后端分离中的跨域问题

    在前后端分离开发中,需要前端调用后端api并进行内容显示,如果前后端开发都在一台主机上,则会由于浏览器的同源策略限制,出现跨域问题(协议.域名.端口号不同等),导致不能正常调用api接口,给开发带来不 ...

  7. javascript 跨域请求详细分析(终极跨域解决办法)

    自从我接触前端以来,接手的项目里面很大部分都是前后端分离的,后端只提供接口,前端根据后端接口渲染出实际页面.个人觉得这是一个挺好的模式,前后端各自负责各自的模块,分工明确,而且也给前端更大的发挥空间. ...

  8. vue跨域问题解决（生产环境）

    vue跨域问题解决(使用webpack打包的) 配置代理:(config下index.js文件) module.exports = { dev: { env: require('./dev.env') ...

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

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

随机推荐

  1. xml配置问题--------不允许有匹配 "[xX][mM][lL]" 的处理指令目标

    剪不断,理还乱,是BUG   相遇:不允许有匹配 "[xX][mM][lL]" 的处理指令目标   在编写MyBatic框架时,纯手编写mybatic-config.xml文件,遇 ...

  2. 用myeclipse快速搭建hibernate实现数据库访问

    前言 hibernate使用的大致过程为引入jar包.配置主配置文件.配置映射文件.编写实体类.编写dao.但是每一步都需要知道的内容都相对不少,造成困难.如果使用myeclipse提供的支持将非常容 ...

  3. 安洵杯iamthinking(tp6反序列化链)

    安洵杯iamthinking tp6pop链 考点: 1.tp6.0反序列化链 2.parse_url()绕过 利用链: 前半部分利用链(tp6.0) think\Model --> __des ...

  4. webjars使用

    目的: Web前端使用了越来越多的JS或CSS,如jQuery,Backbone.js和Bootstrap.一般情况下,我们是将这些Web资源拷贝到Java Web项目的webapp相应目录下进行管理 ...

  5. java集合知识点

    若不重写equals方法,则调用的是object对象的equals方法,相当于==比较,比较的是对象的内存地址 |------Collection接口:单列集合,用来存储一个一个对象 |------L ...

  6. 学习 Python,怎能不懂点PEP 呢？

    或许你是一个初入门 Python 的小白,完全不知道 PEP 是什么.又或许你是个学会了 Python 的熟手,见过几个 PEP,却不知道这玩意背后是什么.那正好,本文将系统性地介绍一下 PEP,与大 ...

  7. Pandas 性能优化 学习笔记

    摘要 本文介绍了使用 Pandas 进行数据挖掘时常用的加速技巧. 实验环境 import numpy as np import pandas as pd print(np.__version__) ...

  8. NGINX生命周期-转

  9. （任意进制转换）将 r 进制数转成 k 进制数

    我们知道任意进制转换为十进制,都是乘以基数的多少次方,然后相加: 十进制转换为任意进制,都是除以基数,然后倒着取余数: 所以这里是用十进制数中转,实现任意进制数的转换 #include<iost ...

  10. Kali中文乱码问题

    上面的是用网上介绍的安装组件无法安装,老是提示最后一句:Unable to locate package ...... 后来觉得应该是因为安装Kali时在最后有个选择更新系统的一个配置上,我选择了下面 ...