前言
本文档只是个人经验记录总结,如有不对的地方欢迎评论补充。
我相信大部分前端开发人员的工作经验都是从公司项目积累的,可能有的小伙伴也很想自己写一些页面程序练习,但是因为没有接口提供,写出来的东西都是只能本地图一乐,没法放到自己的服务器上去远程展示,所以我总结了两种适合前端自己提供接口的方法(前端框架以vue为例)。
一.mock
mock严格意义上不算是后台应用,只是在本地模拟了调用接口,返回数据的过程。在我们前期搭建一些简易项目时比较好用。
使用方法:
首先安装mock依赖
npm i mockjs -S
在根目录创建mock文件,并在vue.config.js里使用mock数据
然后在我们独立的js文件里编写自己需要的数据和接口,并在index.js中引用文件,就可以直接调用我们自己提供出来的接口了
缺点
mock模拟的接口在服务器是无法使用的,所以这个只适合在本地先按照调用接口写流程,完成后更改接口就可以直接使用了,可以配合第二种方法
二.node!
不得不说,node对前端开发来说太友好了,因为用的是JavaScript,所以前端学起来非常非常的快,当然,大致看看就够了,其实不需要学什么。
使用方法:
首先本地得装了node依赖,然后我们可以直接使用基于Node的express框架
npm i express -S //安装框架
npm i express-generator -g -S //搭建模块依赖 不全局安装的话无法使用命令
express 项目名 //框架初始化 生成基础目录
目录结构
bin 启动目录 包含一个启动文件 www 默认端口3000(不用)
node_modules 所有模块的目录
public 所有前端静态资源 html css image js (打包时才需要使用)
routes 放的是路由文件 (最常用到的api接口路由,所有的接口都在这里编写)
views 主要放置ejs后端模板文件
app.js 入口文件 总路由 (用的比较少)
package.json 包描述文件
使用npm i安装描述文件里的依赖
## 使用重点
因为是后台应用 后边是需要提供接口给前端
cors 解决跨域问题
使用:app.js文件
var cors=require('cors')
app.use(cors())
jsonwentoken 解决前端登录需要的token问题
使用:utils文件夹下新建jwt.js
const path = require('path')
const jwt = require("jsonwebtoken");
const SECRET = "QWERTYUIOPasdfghjklZXCVBNM"
const secretKey = '&*^R*G&(FRDwp4eg3' //secret
const expiresIn = 60 * 60 * 24 * 30; //时效 (秒)
class Jwt {
//生成jwt
generateToken(data) {
const token = jwt.sign({ data }, secretKey, {
expiresIn
})
return token
}
//解析jwt
verifyToken(token) {
return jwt.verify(token, secretKey)
}
//计算剩余时间
tokenExp(token) {
let verify = this.verifyToken(token);
let time = parseInt((new Date().getTime()) / 1000);
return `剩余${verify.exp - time}秒`
}
}
// let token = generateToken(1);
// console.log(token); //输出token
// console.log(verifyToken(token)); //输出token内容
// tokenExp(token);
module.exports = Jwt
连接数据库
在根目录新建conf文件夹,在conf里创建db.js和db.config.js
db.js
var mysql = require('mysql')
var dbConfig = require('./db.config')
module.exports = {
query: function(sql, params, callback) {
//每次使⽤的时候需要创建链接,数据操作完成之后要关闭连接
var connection = mysql.createConnection(dbConfig)
connection.connect(function(err) {
if (err) {
throw err
}
//开始数据操作
connection.query(sql, params, function(err, results) {
// connection.query(sql, params, function(err, results, fields) { fields返回undefined的时候程序会终止 所以暂时取消该参数
if (err) {
throw err
}
//将查询出来的数据返回给回调函数
callback &&
callback(
JSON.parse(JSON.stringify(results)),
// JSON.parse(JSON.stringify(fields))
)
//停⽌链接数据库,必须在查询语句后,要不然⼀调⽤这个⽅法,就直接停⽌链接,数据操作就会失败
connection.end(function(err) {
if (err) {
console.log('关闭数据库连接失败!')
throw err
}
})
})
})
},
}
db.config.js
//创建连接
module.exports = {
host: '', //服务器地址
user: '', //用户名
password: '', //用户密码
port: '3306', //端口
database: '', //数据库名称
}
## 追加
又一个nodeman依赖不错,安装完成后 修改package.json里的start node改为nodeman 可以在每次修改api文件时自动重启,不需要自己反复ctrl c手动重启