用js简单提供增删改查接口


Posted in Javascript onMay 12, 2019

本周写实验,需要提供简单的后台接口对数据库进行增删改查,以前写后台只用过php和java,因为比较容易,用js写的也比较快,所以这次想用js实现简单的增删改查接口。

初始化

  • 需要工具:nodejs
  • 依赖:express,mysql,body-parser(这些都是npm的包)

为了能够解析js,需要下载nodejs,下载完nodejs,创建一个文件夹,使用npm init初始化,除了填写名字,一路确定下去,在文件夹下就会多出一个package.json文件.

// package.json
{
 "name": "test",
 "version": "1.0.0",
 "description": "",
 "main": "index.js",
 "scripts": {
 "test": "echo \"Error: no test specified\" && exit 1"
 },
 "author": "",
 "license": "ISC"
}

为了接受并处理http请求,需要引入express这个包,在根目录下使用这个命令:

$ npm install express

此时就引入了express这个包,创建一个index.js文件到根目录下,内容:

var express = require('express');
var app = express();

app.get('/', function(req, res) {
 res.send('hello world!');
});
app.listen(3000, function() {
 console.log('server now listening at 3000 port');
});

打开终端,使用nodejs编译index.js,并且打开浏览器输入localhost:3000就能看到hello world!了:

$ node index.js
server now listening at 3000 port

用js简单提供增删改查接口

这说明我们已经监听了3000端口并且可以用js来处理http请求了.

连接数据库

我使用的是mysql数据库,为了方便操作数据库,引入mysql这个包:

$ npm install mysql
npm WARN test@1.0.0 No description
npm WARN test@1.0.0 No repository field.

+ mysql@2.17.1
added 9 packages from 14 contributors and audited 134 packages in 4.145s
found 0 vulnerabilities

在index.js同路径下创建一个db.js专门用来处理数据库连接问题:

//db.js
var mysql = require('mysql');
var pool = mysql.createPool({ //连接信息
 host: "localhost",
 user: "root",
 password: "",
 database: "c#learn",
 port: "3306"
});

var sql = { 
 insert:'INSERT INTO teacher(name, username, email, sex) VALUES(?,?,?,?)',    
 update:'update teacher set name=?, username=?, email=?, sex=? where id=?', 
 delete: 'delete from teacher where id=?', 
 queryById: 'select * from teacher where id=?', 
 queryAll: 'select * from teacher'
};

function query(sql, data, callback) {
 pool.getConnection(function(err, connection) { 
 connection.query(sql, data, function(err, rows) {
  callback(err, rows);
  connection.release(); //释放连接
 });
 });
}
exports.query = query;
exports.sql = sql;

配置数据库信息获得pool对象,就可以用pool对象来对数据库进行操作,在配置sql语句,将查询方法和sql语句导出给其他模块调用.

提供后台接口

在index.js导入db.js,并且将http请求和数据库操作对接:

var express = require('express');
var app = express();
var db = require('./db.js');

app.get('/', function(req, res) {
 res.header("Access-Control-Allow-Origin", "*");
 db.query(db.sql.queryAll, [], function(err, rows) {
  res.send(JSON.stringify(rows));
 });
});
这时再访问localhost:3000就能看我们teacher表中所有的记录了。
app.listen(3000, function() {
 console.log('server now listening at 3000 port');
});

用js简单提供增删改查接口

另外,为了读取post和put里的body信息,我们需要body-parser这个包:

$ npm install body-parser

使用bodyParser来配置app:

//index.js
var express = require('express');
var db = require('./db.js');
var app = express();
var bodyParser = require('body-parser');

app.use(bodyParser.json());

这时就可以用req.body读取请求体了.

完整代码:

var express = require('express');
var db = require('./db.js');
var app = express();
var bodyParser = require('body-parser');

app.use(bodyParser.json());

app.get('/', function(req, res) {
 res.header("Access-Control-Allow-Origin", "*");
 db.query(db.sql.queryAll, [], function(err, rows) {
  console.log('err', err, 'rows', rows);
  res.send(JSON.stringify(rows));
 });
});

app.get('/:id', function(req, res) {
 res.header("Access-Control-Allow-Origin", "*");
 db.query(db.sql.queryById, [req.params.id], function(err, rows) {
  res.send(JSON.stringify(rows));
 });
});

app.post('', function(req, res) {
 res.header("Access-Control-Allow-Origin", "*");
 console.log(req.body.name);
 var teacher = req.body;
 db.query(db.sql.insert, [teacher.name, teacher.username, teacher.email, teacher.sex], function(err, rows) {
  if (err) {
   res.status(500);
   res.send('insert error');
  } else {
   res.status(200);
   res.send('insert success');
  }
 });
});

app.put('/:id', function(req, res) {
 res.header("Access-Control-Allow-Origin", "*");
 var teacher = req.body;
 var array = [teacher.name, teacher.username, teacher.email, teacher.sex, req.params.id];
 db.query(db.sql.update, array, function(err, rows) {
  if (err) {
   res.status(500);
   res.send('update error');
  } else {
   res.status(200);
   res.send('update success');
  }
 });
});

app.delete('/:id', function(req, res) {
 res.header("Access-Control-Allow-Origin", "*");
 db.query(db.sql.delete, [req.params.id], function(err, rows) {
  if (err) {
   res.status(500);
   res.send('delete error');
  } else {
   res.status(200);
   res.send('delete success');
  }
 });
});

app.listen(3000, function() {
 console.log('server now listening at 3000 port');
});

总结

感觉算是理解了语言只是工具这句话.

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS俄罗斯方块,包含完整的设计理念
Dec 11 Javascript
仿猪八戒网左下角的文字滚动效果
Oct 28 Javascript
jquery在Chrome下获取图片的长宽问题解决
Mar 20 Javascript
Jquery在指定DIV加载HTML示例代码
Feb 17 Javascript
把文本中的URL地址转换为可点击链接的JavaScript、PHP自定义函数
Jul 29 Javascript
一个获取第n个元素节点的js函数
Sep 02 Javascript
Javascript限制网页只能在微信内置浏览器中访问
Nov 09 Javascript
Javascript中prototype与__proto__的关系详解
Mar 11 Javascript
详解用vue2.x版本+adminLTE开源框架搭建后台应用模版
Mar 15 Javascript
深入解析Vue源码实例挂载与编译流程实现思路详解
May 05 Javascript
基于Vue的侧边目录组件的实现
Feb 05 Javascript
详解uniapp的全局变量实现方式
Jan 11 Javascript
electron-vue利用webpack打包实现多页面的入口文件问题
May 12 #Javascript
vue中axios实现数据交互与跨域问题
May 12 #Javascript
jquery3和layui冲突导致使用layui.layer.full弹出全屏iframe窗口时高度152px问题
May 12 #jQuery
JS块级作用域和私有变量实例分析
May 11 #Javascript
微信小程序封装的HTTP请求示例【附升级版】
May 11 #Javascript
微信小程序自定义toast组件的方法详解【含动画】
May 11 #Javascript
jQuery实现动态生成年月日级联下拉列表示例
May 11 #jQuery
You might like
smarty+adodb+部分自定义类的php开发模式
2006/12/31 PHP
PHP伪造referer实例代码
2008/09/20 PHP
计算一段日期内的周末天数的php代码(星期六,星期日总和)
2009/11/12 PHP
php 静态变量的初始化
2009/11/15 PHP
php对文件夹进行相关操作(遍历、计算大小)
2015/11/04 PHP
PHP判断密码强度的方法详解
2017/05/26 PHP
比较全面的event对像在IE与FF中的区别 推荐
2009/09/21 Javascript
jquery的$getjson调用并获取远程的JSON字符串问题
2012/12/10 Javascript
AngularJS基础学习笔记之表达式
2015/05/10 Javascript
jquery实现表单验证简单实例演示
2015/11/23 Javascript
JS实现动态生成html table表格的方法分析
2018/07/11 Javascript
JavaScript作用域、闭包、对象与原型链概念及用法实例总结
2018/08/20 Javascript
实例介绍JavaScript中多种组合继承
2019/01/20 Javascript
Node.js实现用户评论社区功能(体验前后端开发的乐趣)
2019/05/09 Javascript
egg.js的基本使用和调用数据库的方法示例
2019/05/18 Javascript
js图数据结构处理 迪杰斯特拉算法代码实例
2019/09/11 Javascript
LayUI数据接口返回实体封装的例子
2019/09/12 Javascript
vue瀑布流组件实现上拉加载更多
2020/03/10 Javascript
如何使用Javascript中的this关键字
2020/05/28 Javascript
js 函数性能比较方法
2020/08/24 Javascript
[33:23]Secret vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
Django自定义过滤器定义与用法示例
2018/03/22 Python
python的格式化输出(format,%)实例详解
2018/06/01 Python
pytorch实现focal loss的两种方式小结
2020/01/02 Python
Python常见反爬虫机制解决方案
2020/06/01 Python
Python实现我的世界小游戏源代码
2021/03/02 Python
css3的@media属性实现页面响应式布局示例代码
2014/02/10 HTML / CSS
美体小铺瑞典官方网站:The Body Shop瑞典
2018/01/27 全球购物
奥地利智能家居和智能生活网上商店:tink.at
2019/10/07 全球购物
法人授权委托书
2014/04/03 职场文书
药剂专业个人求职信范文
2014/04/29 职场文书
三年级班级文化建设方案
2014/05/04 职场文书
党政领导班子四风问题对照检查材料思想汇报
2014/10/02 职场文书
公民授权委托书
2014/10/15 职场文书
党的群众路线教育实践活动个人对照检查材料(医生)
2014/11/05 职场文书
2015年社区综治宣传月活动总结
2015/03/25 职场文书