Send data to MySql by using Node.js

Question

Hello!

Can any one tell me how to send data from Form to MySql database by using Node.Js?

Here in below some pictures showing when I connected and send data into Mongo Database.

But this time I want to send data into MySql database by using Node.js

Here below is app.js code:

 

 

var express=require('express');

var bodyParser=require('body-parser');

var connection = require('mysql');

var app=new express();

var port=3000;

app.listen(port,function(err){

if(typeof(err)=="undefined"){

console.log('Your application is running on : '+ port+' port');

}

});

var navMenu=[

{href:'/articles',text:'Articles'},

{href:'/projects',text:'Projects'},

{href:'/books',text:'Books'},

{href:'/Contact',text:'Contact Us'},

{href: '/registration', text:'Registration'},

// {href: '/login',text:'Login'}

];

app.use(express.static('public'));//making public directory as static diectory

app.use(bodyParser.json());

app.use(bodyParser.urlencoded({extended:true}));

app.set('views','./src/views');

app.set('view engine','ejs');

var cookieParser=require('cookie-parser');

var passport=require('passport');

var session=require('express-session');

var articlesRouter=require('./src/routes/articlesRoute')(navMenu);

var projectsRouter=require('./src/routes/projectsRoute')(navMenu);

var booksRouter=require('./src/routes/booksRoute')(navMenu);

var contactRouter=require('./src/routes/contactRoute')(navMenu);

var userRouter = require('./src/routes/registrationRoute')(navMenu);

var loginRouter=require('./src/routes/loginRoute')(navMenu);

var profileRouter = require('./src/routes/profileRoute')(navMenu);

var taskRouter = require('./src/routes/TaskRoute');

app.use('/articles',articlesRouter);

app.use('/projects',projectsRouter);

app.use('/books',booksRouter);

app.use('/contact',contactRouter);

app.use('/registration',userRouter);

app.use('/myprofile',profileRouter);

app.use('/task',taskRouter);

app.use(cookieParser());

app.use(session({

secret: 'c-sharpcorner',

resave: false,

saveUninitialized: true,

cookie: { secure: true }

}))

require('./src/configuration/passport')(app);

//for using passport

app.use('/login',loginRouter);

app.use(session({

secret: 'c-sharpcorner',

resave: false,

saveUninitialized: true,

cookie: { secure: true }

}))

require('./src/configuration/passport')(app);

app.get('/',function(req,res){

res.render('index', {

title:'Node.js By Sourabh Somani',

menu:navMenu

});

});

/*

var mysql = require('mysql');

var connection = mysql.createConnection({

host : 'localhost',

user : 'root',

password : '',

database : 'test'

});

connection.connect();

connection.query('SELECT * FROM t_user', function(err, rows, fields)

{

if (err) throw err;

console.log(rows);

});

connection.end();

/*

app.get('/articles', function(req, res) {

res.send('<h1>Welcome to C# Corner Articles.</h1>');

});

app.get('/projects',function(req,res){

res.send('<h1>Hello here will be projects');

});

//create router variables

var articlesRouter=express.Router();

var projectsRouter=express.Router();

var booksRouter=express.Router();

var contactRouter=express.Router();

//Now, define routing for each router, like the following

//rendering articles route

/*

articlesRouter.route("/")

.get(function(req,res){

res.render('articles',{

title:'Articles'

});

});

//rendering projects route

projectsRouter.route("/")

.get(function(req,res){

res.render('projects',{

title: 'Projects'

});

});

//rendring books route

booksRouter.route("/")

.get(function(req,res){

res.render('books',{

title: 'Books'

});

});

//rendering contact route

contactRouter.route("/")

.get(function(req,res){

res.render('Contact',{

title:'Contact us',

menu: navMenu

});

});

//Now, we have to tell our application which router will be used for each different routes. To do that, write the code as shown below.

app.use('/articles',articlesRouter);

app.use('/projects',projectsRouter);

app.use('/books',booksRouter);

app.use('/contact',contactRouter);

var articlesRouter=require('./src/routes/articlesRoute');

var projectsRouter=require('./src/routes/projectsRoute');

var booksRouter=require('./src/routes/booksRoute');

var contactRouter=require('./src/routes/contactRoute');

*/

 Here below is articlesRoute.js file:

 

var express=require('express');

var mongodb=require('mongodb').MongoClient;

var articlesRouter=express.Router();

var a_router=function(navMenu){

articlesRouter.route("/")

.get(function(req,res){

var url='http://MY_SERVER_ADDR:3000/data';

mongodb.connect(url,function(err,db){

var collection=db.collection('articles');

collection.find({}).toArray(function(err,results){

res.render('articles', {

title:'Articles',

menu:navMenu,

articles:results

});

});

});

});

return articlesRouter;

}

module.exports=a_router;

 

Here is article.ejs file for showing data on web-page:

 

 

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1">

<meta name="description" content="">

<meta name="author" content="">

<title><%=title%></title>

<!-- Bootstrap Core CSS -->

<link href="lib/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">

<!-- Custom CSS -->

<link href="css/1-col-portfolio.css" rel="stylesheet">

<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->

<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->

<!--[if lt IE 9]>

<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>

<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>

<![endif]-->

</head>

<body>

<!-- Navigation -->

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">

<div class="container">

<!-- Brand and toggle get grouped for better mobile display -->

<div class="navbar-header">

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">

<span class="sr-only">Toggle navigation</span>

<span class="icon-bar"></span>

<span class="icon-bar"></span>

<span class="icon-bar"></span>

</button>

<a class="navbar-brand" href="/">Node.js Web App</a>

</div>

<!-- Collect the nav links, forms, and other content for toggling -->

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">

<ul class="nav navbar-nav">

<%for(var i=0;i<menu.length;i++){%>

<li>

<a href="<%=menu[i].href%>"><%=menu[i].text%></a>

</li>

<%}%>

</ul>

</div>

<!-- /.navbar-collapse -->

</div>

<!-- /.container -->

</nav>

<!-- Page Content -->

<div class="container">

<!-- Page Heading -->

<div class="row">

<div class="col-lg-12">

<h1 class="page-header">Articles</h1>

</div>

</div>

<!-- /.row -->

<!--Binding Articles Data-->

<%for(var p=0;p<articles.length;p++){%>

<div class="row">

<div class="col-md-3">

<a href="#" class="text-center">

<img class="img-responsive author-img" src="<%=articles[p].AuthorImageUrl%>" alt="">

</a>

</div>

<div class="col-md-9">

<h2><%=articles[p].Title%></h2>

<h5>

<i class='glyphicon glyphicon-folder-open'></i> <span style='margin:0 10px 0 5px;'><%=articles[p].Category%></span>

<i class='glyphicon glyphicon-calendar'></i> <span style='margin:0 10px 0 5px;'><%=articles[p].CreatedDate.toDateString()%></span>

</h5>

<h5>

<i class='glyphicon glyphicon-user'></i> <a href="javascript:void(0)" style='margin:0 10px 0 5px;'><%=articles[p].Author%></a>

</h5>

<p><%=articles[p].ShortDescription%></p>

<a class="btn btn-primary" href="#">Read Article <span class="glyphicon glyphicon-chevron-right"></span></a>

</div>

</div>

<hr/>

<%}%>

<!-- Pagination -->

<div class="row text-center">

<div class="col-lg-12">

<ul class="pagination">

<li>

<a href="#">&laquo;</a>

</li>

<li class="active">

<a href="#">1</a>

</li>

<li>

<a href="#">2</a>

</li>

<li>

<a href="#">3</a>

</li>

<li>

<a href="#">4</a>

</li>

<li>

<a href="#">5</a>

</li>

<li>

<a href="#">&raquo;</a>

</li>

</ul>

</div>

</div>

<!-- /.row -->

<hr>

<!-- Footer -->

<footer>

<div class="row">

<div class="col-lg-12">

<p>Copyright &copy; Your Website 2014</p>

</div>

</div>

<!-- /.row -->

</footer>

</div>

<!-- /.container -->

<!-- jQuery -->

<script src="lib/jquery/dist/jquery.js"></script>

<!-- Bootstrap Core JavaScript -->

<script src="lib/bootstrap/dist/js/bootstrap.min.js"></script>

</body>

</html>

 

 

Answer 1

We have some thrid party controls.
Instead we could write it on our own.

for ex :
Create a Movie Maker Class:

public delegate void RenderFrameDelegate(int frame, AutoResetEvent doneWaitHandle);

    public delegate void CaptureCompleteDelegate(MovieMaker mm);

    public class MovieMaker

    {

        private int _totalFrames;

        private Control _captureControl;

        private RenderFrameDelegate _renderMethod;

        private CaptureCompleteDelegate _captureComplete;

        private AutoResetEvent _waitHandle = new AutoResetEvent(false);

        private bool CaptureSameFrameTwice;

        //private string _imagePath = @"C:\Video Capture Test";

        //private DateTime _fileName;

        //public MovieMaker(Control captureControl, int totalFrames, RenderFrameDelegate renderMethod, CaptureCompleteDelegate captureComplete, DateTime filename)

        public MovieMaker(Control captureControl, int totalFrames, RenderFrameDelegate renderMethod, CaptureCompleteDelegate captureComplete, bool shallCaptureTwice)

        {

            _captureControl = captureControl;

            _totalFrames = totalFrames;

            _renderMethod = renderMethod;

            _captureComplete = captureComplete;

            //_fileName = filename;

            Frames = new List<byte[]>();

            CaptureSameFrameTwice = shallCaptureTwice;

        }

        public void Start()

        {

            IsCapturing = true;

            IsComplete = false;

            ThreadPool.QueueUserWorkItem(RunOnBackgroundThread);

        }

        private void RunOnBackgroundThread(object state)

        {

            int i = 0;

            int captureCount;

            int capturedCount = 0;

            bool firstFrame = true;

            if (CaptureSameFrameTwice)

            {

                captureCount = 2;

            }

            else

            {

                captureCount = 1;

            }

            while (i < _totalFrames)

            {

                // Call delegate to render the control

                _captureControl.Invoke((ThreadStart)delegate { _renderMethod(i, _waitHandle); });

                // Wait to finish

                _waitHandle.WaitOne();

                // Capture image

                _captureControl.Invoke((ThreadStart)delegate

                {

                    Application.DoEvents();

                    using (Image img = new Bitmap(_captureControl.Width, _captureControl.Height))

                    using (MemoryStream stream = new MemoryStream())

                    {

                        Graphics g = Graphics.FromImage(img);

                        Point pt = _captureControl.PointToScreen(new Point(0, 0));

                        g.CopyFromScreen(pt, new Point(0, 0), _captureControl.ClientSize);

                        img.Save(stream, ImageFormat.Jpeg);

                        // img.Save(_imagePath + "\\" + _fileName.ToString("yyyyMMddhhmmss") +i.ToString()+".jpg",ImageFormat.Jpeg);

                        Frames.Add(stream.ToArray());

                    }

                });

                capturedCount += 1;

                if (capturedCount == captureCount)

                {

                    capturedCount = 0;

                    i++;

                }

                if (captureCount == 1 && firstFrame == true)

                {

                    i--;

                    firstFrame = false;

                }

            }

            // Raise complete event

            _captureControl.Invoke((ThreadStart)delegate

            {

                IsCapturing = false;

                IsComplete = true;

                _captureComplete(this);

            });

        }

        public List<byte[]> Frames { get; set; }

        public bool IsCapturing { get; private set; }

        public bool IsComplete { get; private set; }

and then in ur form where want to capture use the below lines:

MovieMaker mc = new MovieMaker(this, videoFrameCount, RenderFrame, CaptureComplete, ShallCaptureTwice);

                    mc.Start();

private void RenderFrame(int frame, AutoResetEvent waitHandle)

        {

            if (frame <= videoFrameCount)

            {

                if (frame == videoFrameCount - 1)

                    DisableProgressBar();

                waitHandle.Set();

               

            }

        }

 private void CaptureComplete(MovieMaker mm)

 {
// Save the data where want to save
}