2016-12-26 2 views
1

지금 Node.js를 배우고 있지만 약간 혼란 스럽습니다.Node.js를 사용하여 HTML로 MySQL 데이터 인쇄

var mysql  = require('mysql'); 
var connection = mysql.createConnection({ 
    host  : 'localhost', 
    user  : 'root', 
    password : '', 
    database : 'db' 
}); 

connection.connect(); 

connection.query('SELECT * FROM users', function(err, rows, fields) 
{ 
    if (err) throw err; 

    console.log(rows[0]); 

}); 

connection.end(); 

내 디버그 콘솔 내 데이터베이스 테이블에서 첫 번째 행을 보여주고있다,하지만 난 내 HTML 페이지에서이 값을 인쇄하고 싶습니다 :

나는 다음과 같은 코드를 사용하여 데이터를 수신하고 있습니다. 어떻게해야합니까?

감사합니다.

답변

0

그 결과를 html 사이트로 보내려면 creating an http server을 조사해야합니다.

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

app.use(express.static('public')) 

var mysql  = require('mysql'); 
var connection = mysql.createConnection({ 
    host  : 'localhost', 
    user  : 'root', 
    password : '', 
    database : 'db' 
});   

app.get('/rows', function (req, res) { 
    connection.connect(); 

    connection.query('SELECT * FROM users', function(err, rows, fields) 
    { 
     connection.end(); 

     if (err) throw err; 

     res.json(rows); 

    }); 
}); 

app.listen(3000, function() { 
    console.log('Example app listening on port 3000!'); 
}); 

이 파일을 실행하면 컴퓨터의 포트 3000에 서버가 만들어집니다.

프로젝트에서 루트 수준에 public 디렉터리를 만듭니다.

<html> 
    <head> 
     <title>My db rows</title> 
    </head> 

    <body> 
     <div id="table"></div> 

     <script type="text/javascript"> 
      var opts = { 
       url: 'http://localhost:3000/rows/' 
      }; 

      fetch(opts) 
       .then((res) => { 
        if (res.ok) { 
         return res.json(); 
        } 
        }) 
        .then((rows) => { 
         for (let row of rows) { 
          // row will be a mysql row -- you can loop over these and do what you want with them 
         } 
        }) 
        .catch(console.log); 
     </script> 
    </body> 
</html> 

주 : 거기에서 당신은 다음과 같은 뭔가 index.html라는 파일을 만들 수 있습니다 내 요청을 실행하기 위해 새로운 가져 오기 API를 사용하고,하지만 당신은 쉽게 JQuery와 또는 XHR를 사용할 수 있습니다. 패치 API는 here으로 자세히 설명 할 수 있습니다.

그런 다음 브라우저에서 http://localhost:3000/index.html으로 이동하여 결과를 확인하십시오.

관련 문제