是时候使用 Vue2 和 Yii2 进行前后端分离开发啦

正文

请到「今天看啥」查看全文

2.1 添加API相关Controller的基础类，这里取名BaseAPIController：

主要解决两个问题：

1. cors问题，就是跨域调用的问题，这个问题可大可小，展开了还能再写很多，这里不细说了。

2. 返回的数据类型，本例所以请求都返回JSON格式数据。

2.1.2 修改接受的请求数据格式

传统的web应用，请求类型通常是x-www-form-urlencoded与multipart/form-data, 对应普通的表单提交，以及文件内容提交，默认Yii2不支持Json格式的请求，需要在config/web.php里修改request组件配置 ：

2.2 添加权限验证控制器

简单起见，不涉及数据库操作，用户名密码如果都符合要求，就返回一个token，这个token的值是100-token,为什么是这个值，请看创建好的Yii2项目的Models目录下的User.php.

2.3 添加需要授权才能访问的控制器

重点是，这个ItemController只有通过验证，才能访问到Index这个action，这里增加的验证器HttpBearerAuth就是用来验证请求的Header里是否带着刚刚分发的token, 之所以不对OPTIONS请求做验证，是因为OPTIONS请求不带别的信息啊，没法验证。浏览器非要在请求之前发个OPTIONS请求，也没办法。

2.4 测试

打开浏览器访问 http://basic.backend.local/item 正常情况下，会返回为授权信息 ：

前台

前端采用Vue2这个单独好用的js框架，文档丰富，社区活跃，最难得的是作者很帅！

1.安装Node和vue-cli

现在前端没有Node简直寸步难行，所以Node是必须安装的，去官网下个安装包，安装好。然后再安装vue-cli工具。

2.创建Vue单页面程序

运行命令：

会让您输入必要的信息，如项目名称，描述，作者之类的。这里简单起见，一路默认回车就是啦。

请到「今天看啥」查看全文