Express实现前端后端通信上传图片之存储数据库(mysql)傻瓜式教程(二)


Posted in Javascript onDecember 10, 2015

在上篇文章给大家介绍了express实现前端后端通信上传图片之存储数据库(mysql)傻瓜教程(一)

数据库如标题,使用开源的mysql为基础,我是下载的解压版本(自行百度就有,用百度下载的就行),配置过程https://3water.com/article/76206.htm,本人在安装过程中,对于配置my.ini文件着实找了好久的教程,所以贴上本人的my.ini文件

[mysqld]
basedir="D:/MySql" 
datadir="D:/MySql/data" 
port = 3306
socket = "/tmp/mysql.sock"
[client] 
password = 
port = 3306
socket = "/tmp/mysql.sock"
default-character-set = utf8

可以看到我的mysql是安装在Mysql文件夹下的,大家可以按照自己的路径进行修改。

然后在bin文件夹下运行

mysqld -install

安装mysql服务,然后启动服务。

net start mysql

上面的配置mysql教程链接中有navicat for mysql的下载地址(是mysql的可视化工具),还有注册的信息,不想打命令行的同学可以下载使用,更加方便些。

第一次登陆数据库

mysql -uroot -p

直接回车,没有密码。

(ps:我在使用中手动填写数据库时,输入中文时会有乱码问题,解决方案如下:右键一个数据库,然后选择数据库属性,修改字符集为utf8格式,整理选择第一个就行,如图:
        )

下面就要使用node连接数据库了。各位看官可以泡杯茶继续~。

felixge/node-mysql是一个纯nodejs的用javascript实现的一个MySQL客户端程序。felixge/node-mysql封装了Nodejs对MySQL的基本操作,100% MIT公共许可证。

项目地址:https://github.com/felixge/node-mysql

在项目中安装node-mysql,进入昨天建立好的myapp文件夹,运行:

npm install mysql

接下来进行测试,把官网的例子修改下,放到咱们的项目里面,修改routes/index.js,重启express

var express = require('express');
var router = express.Router();var mysql = require('mysql'); //调用MySQL模块
router.get('/', function(req, res) {
 res.render('index', {
 title: '孟星魂'
 });
 //创建一个connection
 var connection = mysql.createConnection({
 host: '127.0.0.1', //主机
 user: 'root', //MySQL认证用户名
 password: '111', //MySQL认证用户密码,没有测试没有密码时为空是否能登陆,不能的话设置下登陆密码
 port: '3306', //端口号
 database: 'nodesample'
 });
 //创建一个connection
 connection.connect(function(err) {
 if (err) {
 console.log('[query] - :' + err);
 return;
 }
 console.log('[connection connect] succeed!');
 });
 //执行SQL语句
 connection.query('SELECT 1 + 1 AS solution', function(err, rows, fields) {
 if (err) {
 console.log('[query] - :' + err);
 return;
 }
 console.log('The solution is: ', rows[0].solution);
 });
 //关闭connection
 connection.end(function(err) {
 if (err) {
 return;
 }
 console.log('[connection end] succeed!');
 });
});
module.exports = router;

 打开页面后,命令符显示效果如下:

 测试成功!!,下面建立测试数据库

CREATE DATABASE IF NOT EXISTS nodesample CHARACTER SET UTF8;
USE nodesample;
SET FOREIGN_KEY_CHECKS=0;
DROP TABLE IF EXISTS `userinfo`;
CREATE TABLE `userinfo` (
 `Id` int(11) NOT NULL AUTO_INCREMENT COMMENT '主键',
 `UserName` varchar(64) NOT NULL COMMENT '用户名',
 `UserPass` varchar(64) NOT NULL COMMENT '用户密码',
 PRIMARY KEY (`Id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COMMENT='用户信息表';

这段代码可以直接在navicat里面运行,点击工具,console,粘贴,回车就好了。

接下来往数据库中添加一条数据,修改routes/index.js,如下

var express = require('express');
var router = express.Router();
var mysql = require('mysql'); //调用MySQL模块
router.get('/', function(req, res) {
 res.render('index', {
 title: '孟星魂'
 });
 //创建一个connection
 var connection = mysql.createConnection({
 host: '127.0.0.1', //主机
 user: 'root', //MySQL认证用户名
 password: '111', //MySQL认证用户密码
 port: '3306', //端口号
 database: 'nodesample'
 });
 //创建一个connection
 connection.connect(function(err) {
 if (err) {
 console.log('[query] - :' + err);
 return;
 }
 console.log('[connection connect] succeed!');
 });
 //执行SQL语句
 var userAddSql = 'INSERT INTO userinfo(Id,UserName,UserPass) VALUES(0,?,?)';
 var userAddSql_Params = ['Wilson', 'abcd'];
 //增
 connection.query(userAddSql, userAddSql_Params, function(err, result) {
 if (err) {
 console.log('[INSERT ERROR] - ', err.message);
 return;
 }
 console.log('--------------------------INSERT----------------------------');
 //console.log('INSERT ID:',result.insertId); 
 console.log('INSERT ID:', result);
 console.log('-----------------------------------------------------------------\n\n');
 });
 //关闭connection
 connection.end(function(err) {
 if (err) {
 return;
 }
 console.log('[connection end] succeed!');
 });
});

module.exports = router;

重启express,刷新页面,命令符显示:

数据库显示:

好了,现在大家已经可以操作数据库了,基本的一些操作请参考http://www.cnblogs.com/zhongweiv/p/nodejs_mysql.html#mysql_mod,增删改查里面都有介绍。

 

后面应该是介绍大家上传的图片存储数据库的,但遇到了一些坑,才解决,最精彩的留在明天~,

主要是路由的问题,主页请求了模板,这个时候是无法在往前端发送数据的,所以会用到express的中间件,大家晚安~。

Javascript 相关文章推荐
js 自制滚动条的小例子
Mar 16 Javascript
javascript判断两个IP地址是否在同一个网段的实现思路
Dec 13 Javascript
js通过元素class名字获取元素集合的具体实现
Jan 06 Javascript
判断在css加载完毕后执行后续代码示例
Sep 03 Javascript
jQuery插件EasyUI校验规则 validatebox验证框
Nov 29 Javascript
Node.js操作mysql数据库增删改查
Mar 30 Javascript
BootStrap制作导航条实例代码
May 06 Javascript
前端学习笔记style,currentStyle,getComputedStyle的用法与区别
May 28 Javascript
BootStrap下jQuery自动完成的样式调整
May 30 Javascript
JavaScript 计算笛卡尔积实例详解
Dec 02 Javascript
JavaScript函数基础详解
Feb 03 Javascript
Angular利用trackBy提升性能的方法
Jan 26 Javascript
Express的路由详解
Dec 10 #Javascript
在 Express 中使用模板引擎
Dec 10 #Javascript
Express实现前端后端通信上传图片之存储数据库(mysql)傻瓜式教程(一)
Dec 10 #Javascript
基于jQuery实现复选框是否选中进行答题提示
Dec 10 #Javascript
日常收集整理的JavaScript常用函数方法
Dec 10 #Javascript
详解AngularJS中module模块的导入导出
Dec 10 #Javascript
SpringMVC restful 注解之@RequestBody进行json与object转换
Dec 10 #Javascript
You might like
php 结果集的分页实现代码
2009/03/10 PHP
PHPWind与Discuz截取字符函数substrs与cutstr性能比较
2011/12/05 PHP
php中的filesystem文件系统函数介绍及使用示例
2014/02/13 PHP
smarty模板引擎从php中获取数据的方法
2015/01/22 PHP
PHP实现将textarea的值根据回车换行拆分至数组
2015/06/10 PHP
64位windows系统下安装Memcache缓存
2015/12/06 PHP
非常实用的php验证码类
2016/05/15 PHP
php检测mysql表是否存在的方法小结
2017/07/20 PHP
利用 fsockopen() 函数开放端口扫描器的实例
2017/08/19 PHP
JavaScript面向对象编程
2008/03/02 Javascript
js表格分页实现代码
2009/09/18 Javascript
jquery获取焦点和失去焦点事件代码
2013/04/21 Javascript
JS 实现Table相同行的单元格自动合并示例代码
2013/08/27 Javascript
javascript显式类型转换实例分析
2015/04/25 Javascript
动态加载jQuery的方法
2015/06/16 Javascript
jquery对复选框(checkbox)的操作汇总
2016/01/13 Javascript
Function.prototype.apply()与Function.prototype.call()小结
2016/04/27 Javascript
Bootstrap Chart组件使用教程
2016/04/28 Javascript
AngularJS extend用法详解及实例代码
2016/11/15 Javascript
Html5 js实现手风琴效果
2020/04/17 Javascript
vue2.0数据双向绑定与表单bootstrap+vue组件
2017/02/27 Javascript
JavaScript中严格判断NaN的方法
2018/02/16 Javascript
深入学习TypeScript 、React、 Redux和Ant-Design的最佳实践
2019/06/17 Javascript
vue3.0中使用postcss-pxtorem的具体方法
2019/11/20 Javascript
[06:15]2016国际邀请赛中国区预选赛单车采访:我顶WINGS
2016/06/27 DOTA
[05:00]TI9战队采访 - Royal Never Give Up
2019/08/20 DOTA
为Python程序添加图形化界面的教程
2015/04/29 Python
Python random模块用法解析及简单示例
2017/12/18 Python
python删除不需要的python文件方法
2018/04/24 Python
Python使用paramiko操作linux的方法讲解
2019/02/25 Python
HTML5中在title标题标签里设置小图标的方法
2020/06/23 HTML / CSS
中学生校园广播稿
2014/01/16 职场文书
学雷锋演讲稿
2014/03/04 职场文书
西式结婚主持词
2014/03/14 职场文书
讲文明树新风演讲稿
2014/05/12 职场文书
大学生入党积极分子党校学习思想汇报
2014/10/25 职场文书