2020-02-08

express+node.js+mysql +vue （亲测有效）

最近自己写api在网上搜了很多资料，终于写好了，记录下来，希望少走弯路；

这里我是自己装的mysql,和可视化工具，比较麻烦，装了mysql还要配置环境，后来才知道有phpStudy这个工具，比较方便，装一个phpStudy就可以自动集成mysql，还有可视化工具，而且无需配置环境

一.express 基于node.js平台快速，开放，极简的web开发框架

（1）使用npm命令安装常用的node.js web框架模块express;

    npm i express -g

 (2) 安装express项目生成器

       npm i   express-generator  -g 

（3）建立一个新项目 cms_Api

express -e cms_Api

显示下图建立成功，

然后，npm install装依赖，npm start 启动，网页进入http://localhost:3000/查看是否启动成功

二：mysql （这里建议装phpStudy比较方便）

1.mysql下载链接

https://dev.mysql.com/downloads/mysql/

2.mysql可视化工具下载链接

https://www.mysql.com/products/workbench/

（注:mysql官网下载比较慢,可以复制链接到迅雷）

三：数据库的链接

1.第一步

2.第二步

下图写一个例子,来测试接口，此sql语句用来获取数据库中的user表的数据，写完user.js中的代码的时候，npm start运行项目，在浏览器中打开：http://localhost:3000/users查看user表中的数据

得到数据如下即可

四:下面我们来说下，vue中如何调用后端接口（由于vue项目是http://localhost:8080/）express项目的api是(http://localhost:3000/)所以，会造成跨域问题,这里我们用cors解决跨域问题

1.先说下express中的cors

首先安装 npm i cors --save

2.vue用的是2.5.2版本，调用接口用的axios

（1）安装axios 

        npm i  --save axios

（2）建立一个文件，用来封装axios

main.js中添加

（3）调用