我们在做项目时,一切基础在于数据上面,所以接入api接口是关键。

访问接口是我们会遇到跨域,而,vue-cli给我们提供了反向代理,所以我们只需要配置一下就可以了。

在config文件中找到index.js,修改dev对象里面的proxyTable如图

然后我们在同个文件夹里面打开dev.env.js这个是生产环境配置文件,我们进行修改

再打开同文件夹中的prod.env.js,这个是我们正式环境的配置文件啦,我们项目上线后访问的就是他了

就这样,我们就可以在组件里面调用接口了

今天对于接口对接,就到这啦。欢迎错误指正。。。

vue项目接入api接口的更多相关文章

  1. 原有vue项目接入typescript

    原有vue项目接入typescript 为什么要接入typescript javascript由于自身的弱类型,使用起来非常灵活. 这也就为大型项目.多人协作开发埋下了很多隐患.如果是自己的私有业务倒 ...

  2. Vue项目接入MQTT

    Vue项目接入MQTT 安装mqtt库 npm install mqtt --save Vue代码实现 <template> <div id="app"> ...

  3. vue项目接入markdown

    vue 项目接入 markdown 最近做一个项目,需要在vue项目中接入 markdown 编辑器,其实这个好接,他没有什么特别的样式,男的就是图片的上传. 今天给大家推荐一个插件 :mavonEd ...

  4. vue项目axios请求接口,后端代理请求接口404,问题出现在哪?

    在vue项目中,列表数据需要用到qq音乐接口中的数据,但是直接请求不行,有host及referer限制,需要采用后端代理的方式.借助axios及node的express,在dev-server.js中 ...

  5. 构建:vue项目配置后端接口服务信息

    背景 vue-cli脚手架生成的webpack标准模板项目 HTTP库使用axios 一.开发环境跨域与API接口服务通信 整体思路: 开发环境API接口请求baseURL为本地http://loca ...

  6. vue项目接入百度地图

    方法一 :使用第三方工具 vue-baidu-map 安装命令: yarn add vue-baidu-map --save 文档地址:https://dafrok.github.io/vue-bai ...

  7. vue项目 封装api

    设计思路 为了加强项目的可维护性,建议将请求接口api进行统一封装, 一个常规项目的基础地址一般为唯一,所以考虑将基础地址设定一个变量 let  baseUrl: "xxxxxx" ...

  8. Vue项目中的接口进阶使用

    创建services文件夹 1.文件夹apis.index.request的三个文件. 2.apis文件放接口 export const apis = { checkDeviceNo: '/api/c ...

  9. 提升Spring Boot项目中API接口并发能力的一个注解,效果明显

    异步调用几乎是处理高并发Web应用性能问题的万金油,那么什么是"异步调用"?"异步调用"对应的是"同步调用",同步调用指程序按照定义顺序依次 ...

随机推荐

  1. Facebook巴特尔与谷歌移动广告 急于打开中国市场

    随着Facebook(62.5, -0.69, -1.09%)即将设立了销售办事处在北京发酵消息.谷歌(556.33, 2.43, 0.44%)似还差点自觉保护国内市场. 6月5日,谷歌在深圳举行了面 ...

  2. 使用batch批处理做目录及流程选择

    @echo off rem -- http://phpnow.org rem -- YinzCN_at_Gmail.com setlocal enableextensions if exist Pn\ ...

  3. hdu 4374 单调队列

    求一个最大k连续的子序列和   单调队列 #include<stdio.h> #include<string.h> #include<iostream> using ...

  4. 文章之间的基本总结Activity生命周期

    子曰:溫故而知新,能够為師矣.<論語> 学习技术也一样,对于技术文档或者经典的技术书籍来说,指望看一遍就全然掌握,那基本不大可能,所以我们须要常常回过头再细致研读几遍,以领悟到作者的思想精 ...

  5. WPF 呼吸灯特效

    原文:WPF 呼吸灯特效 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/u014117094/article/details/46738621 pa ...

  6. linux下一个rsync工具和配置

    本文介绍了整个基本:http://www.2cto.com/os/201308/238733.html 一些简单的备忘录: 1. ubuntu下通过apt-get就可以安装: 2. 配置文件/etc/ ...

  7. AngularJS 多级下拉框

    <div ng-app="MultiDropDownApp" ng-controller="MultiDropDownControl as vm"> ...

  8. WPF依赖项属性不需要包装属性也可以工作

    using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threa ...

  9. ELINK编程器支持芯片详细列表

    支持MCU芯片包括:STM32  F0.F1.F2.F3.F4.L0.L1全系列: GD32 F10XX系列. 各系列芯片支持详情如下:

  10. 在2005年,Unicode 的第十万个字符被采纳且认可成为标准之一(超过这65535范围的Unicode字符,则需要使用一些诡异的技巧来实现)

    在计算机科学领域中,Unicode(统一码.万国码.单一码.标准万国码)是业界的一种标准,它可以使电脑得以体现世界上数十种文字的系统.Unicode 是基于通用字符集(Universal Charac ...