教你在局域网部署前端vue+后端php的网站服务
1、阅读对象
本篇教程适合新手阅读，老手可以直接×掉了
2、教程难度
初级
本人水平有限，文章内容难免会出现问题，如果有问题欢迎指出，谢谢
前言
如今网站建设流行前后端分离，作者也应时代潮流，适用VUE做前端，后台由PHP来做接口，在开发中有许多的坑，为了填空查阅了很多资料，如今总算是圆满结束。
开发时期
在开发阶段，用的是VScode编辑器。
在创建了vue-cli脚手架后，开始开工。
1.遇到的第一个坑
开发初期后端还没确定人选，让我先做界面，既然是前后端分离，必定需要数据字典，HTTP协议自动转换为全小写字母。而我在编辑数据字典时，变量名掺杂了大写字母，导致后来接收参数的时候，找不到变量名。
不能定成这种大小写混合的变量名，而且还这么长，后端会骂死你的。
2.还是跨域问题
PHP大佬说他已经添加了跨域访问的代码，但是我这边还是爆跨域错误，错误如下。
查询了无数资料后，才知道开发环境下vue-cli必须要配置自带的跨域代理服务，才可以跨域访问PHP后端
在你项目根目录下的config/index.js中配置proxyTable即可，target填写后端给你接口的域名，其他参数照抄即可。
配置完成后在你请求的接口的最前面写上/api，后面是你的接口路径，千万不要写接口域名，如下图
然后重新运行 npm run dev 即可实现vue在开发环境下跨域的问题。
3接下来遇见传参问题
ajax post数据提交 PHP后台接收不到数据
测通接口后，当给后端传参，后端没收到参数。
原来是axios发送的是json格式的数据，而后端只接受传统的form data格式的数据，json后台程序不认识。前端发的是这种application/json
知道了原因，几种解决办法如下
1.改请求头格式
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
或者
{headers:{'Content-Type':'application/x-www-form-urlencoded'}}
我试了一下，其实这样还是不太好的
2.qs转换参数
【还需要额外的操作，（我们要将参数转换为query参数）】引入 qs ，这个库是 axios 里面包含的，不需要再下载了。
3.解决办法三，让你的后台改一下接收方式，让他这样接收（墙裂推荐）
作者采用的是这种方式，让后端改。
终于一切都通了，我们开始测接口把，但是.......
当登陆接口测通以后，第二接口，爆404错误，什么情况，我和后端检查代码，代码没错，那为啥会爆404错误
经过排查，问题终于被发现了，后端查询数据库，数据表中有个字段和查询语句的变量名不一致，数据库爆404，php框架就把错误返前端了，并不是接口找不到，真是菜逼前端遇见菜逼后端了
然后一路到开发完毕，项目可以上线了。问题是客户需要项目上线到他们的局域网，只提供一台电脑当作服务器。
VUE和PHP需要部署到局域网？
后端在服务器电脑上，装载了这个小东西
而我把打包好的dist目录下的文件放在了PHP文件的根目录下，然后把项目放在phpStudy下的www目录内
启动服务，能访问了，问题又出现了，前端页面接口404错误。前端的请求接口怎么填？填那台服务器的局域网IP？
不填请求IP，就写相对路径，如下图。
输入那台电脑的ip，测试，完成，局域网内其他电脑都能正常使用。
总结
这是本人初学vue开发项目中遇到的问题。菜狗遇见菜狗
后记
此文章之前发过，当时本人不会排版，没有图文并茂没几个人看，如今重构一番
