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 相关文章推荐
基于jquery的bankInput银行卡账号格式化
Aug 22 Javascript
Javascript优化技巧之短路表达式详细介绍
Mar 27 Javascript
JavaScript实现向右伸出的多级网页菜单效果
Aug 25 Javascript
如何利用JSHint减少JavaScript的错误
Aug 23 Javascript
js制作网站首页图片轮播特效代码
Aug 30 Javascript
Vue分页组件实例代码
Apr 17 Javascript
微信小程序 图片宽高自适应详解
May 11 Javascript
node通过express搭建自己的服务器
Sep 30 Javascript
vue-image-crop基于Vue的移动端图片裁剪组件示例
Aug 28 Javascript
vue加载完成后的回调函数方法
Sep 07 Javascript
JavaScript实现省份城市的三级联动
Feb 11 Javascript
JavaScript监听一个DOM元素大小变化
Apr 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水印技术
2007/02/14 PHP
Zend Framework中的简单工厂模式 图文
2012/07/10 PHP
PHP中常用的魔术方法
2017/04/28 PHP
用javascript实现的激活输入框后隐藏初始内容
2007/06/29 Javascript
jQuery getJSON()+.ashx 实现分页(改进版)
2013/03/28 Javascript
Jquery的each里用return true或false代替break或continue
2014/05/21 Javascript
javascript数组详解
2014/10/22 Javascript
jQuery调用ajax请求的常见方法汇总
2015/03/24 Javascript
jQuery拖拽插件gridster使用指南
2015/04/21 Javascript
js 获取站点应用名的简单实例
2016/08/18 Javascript
浅谈JQ中mouseover和mouseenter的区别
2016/09/13 Javascript
JavaScript交换两个变量值的七种解决方案
2016/12/01 Javascript
Angular 4依赖注入学习教程之ValueProvider的使用(七)
2017/06/04 Javascript
bootstrap动态调用select下拉框的实例代码
2018/08/09 Javascript
浅析JS中什么是自定义react数据验证组件
2018/10/19 Javascript
图解javascript作用域链
2019/05/27 Javascript
解决VUE双向绑定失效的问题
2019/10/29 Javascript
JS面向对象编程实现的拖拽功能案例详解
2020/03/03 Javascript
vue+koa2搭建mock数据环境的详细教程
2020/05/18 Javascript
Vue如何基于vue-i18n实现多国语言兼容
2020/07/17 Javascript
antd 表格列宽自适应方法以及错误处理操作
2020/10/27 Javascript
Python SQLAlchemy基本操作和常用技巧(包含大量实例,非常好)
2014/05/06 Python
python查询mysql中文乱码问题
2014/11/09 Python
Python实现KNN(K-近邻)算法的示例代码
2019/03/05 Python
Django静态资源部署404问题解决方案
2020/05/11 Python
详解pyqt5的UI中嵌入matplotlib图形并实时刷新(挖坑和填坑)
2020/08/07 Python
Python 图片处理库exifread详解
2021/02/25 Python
建筑工程管理专业自荐信范文
2013/12/28 职场文书
自考生自我评价分享
2014/01/18 职场文书
法学专业自我鉴定
2014/02/05 职场文书
学生会竞聘书范文
2014/03/31 职场文书
改作风抓落实促发展心得体会
2014/09/10 职场文书
房屋过户委托书范本
2014/10/07 职场文书
乡镇群众路线整改落实情况汇报
2014/10/28 职场文书
2015年综治宣传月活动总结
2015/03/25 职场文书
保护环境建议书作文400字
2015/09/14 职场文书