记关于vue-cli3 本地代理模拟数据的实践
网上说的基本都是使用express或http-server作为服务器或其它什么东西
自己把玩php也有些年头,就用php好了
服务环境 apache,php先配置好隐藏php后缀扩展名:
在httpd.conf中 FilesMatch 标签内增加:ForceType application/x-httpd-php
这样只针对主端口下的隐藏,自定义端口折腾了半天,无法使用此法,只能用urlrewrite
先在httpd.conf开启模块 :LoadModule rewrite_module modules/mod_rewrite.so
在虚拟端口配置文件中增加:
RewriteEngine on
RewriteRule ^(.*)$ $1\.php
重启apache
配置代理:
用的是vue-cli3,在项目根目录下增加vue.config.js :
module.exports = {
devServer: {
port: 8999,
proxy: {
'/api': { target: 'http://localhost:81/', changeOrigin: false },
'/api_test': { target: 'http://localhost:81/', changeOrigin: false }
}
},
}
请求:
this.$axios.get("/api")
.then(function(repsonse){
console.log(repsonse);
})
.catch(function(error){
console.log(error);
});
记关于vue-cli3 本地代理模拟数据的实践的更多相关文章
- react和vue配置本地代理
React 在react中配置开发环境下的本地代理相对比较简单,直接在package.json文件中修改即可. 但是这样做有其局限性,如果开发中代理多个接口的时候将无法满足需求,我们需要的是下面这种的 ...
- 如何在Vue中使用Mockjs模拟数据的增删查改
之前一直使用json-server在前端开发时,搭建本地数据接口测试,但有时又需要将做好的项目放于 github page上做项目演示.在本地时,json server很好使用,但一旦放在github ...
- 【vue】生成接口模拟数据
目录 方案一:自定义模拟数据 Step1 创建json文件 Step2 在 vue.config.js 中配置 Step3 在组件中使用 (方式一) Step3 封装api (方式二) Step4 在 ...
- 【vue】本地开发mock数据支持
项目离不开数据渲染的支持,为本地开发配置 数据 支持. (一)方式一:安装JSON Server搭建mock数据的服务器 json Server 是一个创建 伪RESTful服务器的工具. 配置流程 ...
- vue 使用mock来模拟数据
首先,需要安装mock npm install mockjs --save-dev 在main.js中引入mock mock文件写法如下: const Mock = require('mockjs') ...
- vue+mock.js+element-ui模拟数据搞定分页
效果如图: 前提是搭好vue前端框架,npm install mockjs引入mock.js 当前页全部代码如下,其他有关element-ui的引入未提到,仅作参考用 <!-- 用户管理 --& ...
- vue项目的webpack设置请求模拟数据的接口方法
最近在跟着视频写饿了吗vue项目,其中模拟数据由于webpack版本变化,跟视频中不一致,下方博客有解决方案,其实视频里面的还能看懂,现在webpack的服务都在插件包里了,好难找. 请参考:http ...
- 在 vue cli3 的项目中配置双服务,模拟 ajax 分页请求
最近安装了下vue cli3版本,与 cli 2 相比,文件少了,以前配置方法也不管用了.demo 中的大量的数据,需要做成 ajax 请求的方式来展示数据,因此,需要启动两个服务,一个用作前端请求, ...
- Vue CLI 3.0脚手架如何在本地配置mock数据
前后端分离的开发模式已经是目前前端的主流模式,至于为什么会前后端分离的开发我们就不做过多的阐述,既然是前后端分离的模式开发肯定是离不开前端的数据模拟阶段. 我们在开发的过程中,由于后台接口的没有完成或 ...
随机推荐
- Smart Disk -- proposed by Liyuan Liu
Need 如今,照相渐渐得成为了人们的日常举动.几乎所有的人都在随时随地得照相.手机,相机,平板越来越多的设备对照相进行了支持,同时, 照片以一种前所未有的速度渐渐淹没我们的文件夹.而寻找照片,对照片 ...
- PAT 1017 A除以B
https://pintia.cn/problem-sets/994805260223102976/problems/994805305181847552 本题要求计算A/B,其中A是不超过1000位 ...
- HDU 2088 Box of Bricks
http://acm.hdu.edu.cn/showproblem.php?pid=2088 Problem Description Little Bob likes playing with his ...
- MyBatis分步查询的延迟加载
延迟加载的概念只存在于分步查询时: 延迟加载的本质是为第一步查询返回的Java Bean创建了一个代理对象: 延迟加载的全局设置有两个: lazyLoadingEnabled,作用为设置select语 ...
- Vue-router的基本用法
刚学习vue不久,就接触了路由这个好东西.下面简单聊聊vue-router的基本用法. 一.路由的概念 路由,其实就是指向的意思,当我点击页面上的home按钮时,页面中就要显示home的内容,如果点击 ...
- String类的一些细节
先看一段代码: public static void main(String[] args) { String a = "a"+"b"+1; ...
- BZOJ2744 HEOI2012朋友圈(二分图匹配)
先考虑B国.容易发现a xor b mod 2=0即二进制末位相同,那么可以据此将所有人分成两部分,每一部分各自是一个完全图.然后再将a or b有奇数个1的边连上,现在需要求的就是这样一个图里的最大 ...
- Go 语言中的方法,接口和嵌入类型
https://studygolang.com/articles/1113 概述 在 Go 语言中,如果一个结构体和一个嵌入字段同时实现了相同的接口会发生什么呢?我们猜一下,可能有两个问题: 编译器会 ...
- Eclipse Neon 汉化
官网下载的Eclipse是英文版的,对于初学者来说为了减小学习的难度,将英文版汉化是有必要的. 第一步:依次点击Eclipse菜单栏上的“Help"-->”About",查看 ...
- mongoDB的使用(NodeJs)
MongoDB相信大家都不太陌生了,但是究竟它和我们熟悉的MySQL(MariaSQL).SQLServer有什么区别呢? 我们熟悉的MySQL是关系型数据,每个数据表都有严格的数据结构规定,因而我们 ...