记关于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数据
前后端分离的开发模式已经是目前前端的主流模式,至于为什么会前后端分离的开发我们就不做过多的阐述,既然是前后端分离的模式开发肯定是离不开前端的数据模拟阶段. 我们在开发的过程中,由于后台接口的没有完成或 ...
随机推荐
- Python爬虫爬中文却显示Unicode,怎样显示中文--问题解答
首先爬取古诗网站时,显示 原因是因为输出为列表[] 如果写一个循环,输出其中每个元素就为中文了...
- 第二阶段Sprint8
昨天:把视频录制整合到时间提醒里,实现视频提醒 今天:重新规划主界面,把视频录制暂放到主页面里,先实现功能,视频提醒后期再做. 遇到的问题:还是有问题,虽然能运行,但是只能播放,不能录了啊...
- 老李的blog使用日记(2)
寥寥数语结束一个不曾期待的遇见,可还是剧情不会这样结束,他也会在我的时间里注册自己的专属账号,无论什么时候,他会时而需要被注视着,为了达到目的,即使不择手段,只为一次擦肩而过的邂逅,极短的一段时间,相 ...
- Java入门第二季第2章封装
什么是 Java 中的内部类 问:什么是内部类呢? 答:内部类( Inner Class )就是定义在另外一个类里面的类.与之对应,包含内部类的类被称为外部类. 问:那为什么要将一个类定义在另一个类里 ...
- week5-Internetwork Layer
Technology:Internets and Packets course Layer 2 : Internet Protocol The InterNetwork Internetwork La ...
- Docker(二十二)-Docker Swarm常用命令
#查看集群节点 docker node ls #创建nginx服务 #docker pull hub.test.com:5000/almi/nginx:0.1 #下载私有仓库镜像 docker ser ...
- JavaWeb开发之详解Servlet及Servlet容器
自JavaEE诞生伊始,Servlet容器和Servlet技术,就构成了JavaEE应用的核心,配合其它组件,它们完善了Java企业级开发的全套解决方案.小到一个静态博客网站,大到分布式的集群应用,都 ...
- 如何使用js判断视频是否可以成功访问
日常工作中会出现各个公司网络不互通的情况,视频如果采用不互通的地址也无法播放,下面方法提供了检测视频是否可以播放的解决方案: 1.跨域 var video = document.createEleme ...
- Vue---父子组件之间的通信
在vue组件通信中其中最常见通信方式就是父子组件之中的通信,而父子组件的设定方式在不同情况下又各有不同.最常见的就是父组件为控制组件子组件为视图组件.父组件传递数据给子组件使用,遇到业务逻辑操作时子组 ...
- 清华集训2015-Day 1
玛里苟斯 一个大小为 \(n\) 的可重集合 \(a\) ,求 \(\mathbb E[x^k]\) ,其中 \(x\) 为 \(a\) 的一个子集的异或和. \(n\le 10^5,1\le k\l ...