메모장
DB 복습 5 본문
Node.js를 이용한 Oracle 연결 및 SQL 실행
Node.js 웹서버에 웹브라우저로 접속
GET Request
Post Request
Unreal Engine에서 VaRset 플러그인을 통한 웹서버 접속
Unreal Engine 로그인 -> Node.js(웹서버) -> Oracle
http/tcp가 충족되어야 Web Client가 Web Server에 접근할 수 있다
https://jinbroing.tistory.com/87 -> 설명 잘 나와있다
▣ express
- 웹서버를 쉽게 구축할 수 있게하는 프레임워크
- 프레임워크란
(1) 어플리케이션을 구현할 때 어플리케이션 구현에 꼭 필요한 부분, 구조를 미리 구현해둔 구조체
(2) 루비에는 레일즈(그래서 ruby on rails), php는 라라벨, java는 spring, nodejs는 express를 주로 사용함
express로 웹서버 만들기???
//express_text.js
var express = require('express'); // express를 쓰려면
var app = express(); // express 의 Top level 함수 // 이 둘이 항상 먼저 나와야 한다
app.※get('/', function (req, res) { // 클라이언트가 자료 얻기를 요구, req(require)요청 / res(respond)응답
res.send('Hello World!'); // req, res는 변수이름이므로 A, B등과 같이 해도 된다
}); // res에는 req한 컴퓨터의 IP주소가 담겨있기에 응답해줄 수 있다
app.listen(3000, function(){ // listen -> 접속하는지 기다린다/감청한다? 80번 포트는 안쓰는게 국롤
console.log('Example app listening on port 3000!'); // 80번이 아니면 적어주는것 또한 국롤
});
※ HTTP 프로토콜에 정의된 전송 방식 (Method)
- Get : 클라이언트가 서버에 무언가를 얻고자 할 때 사용
- Post : 클라가 서버에 무언가를 보내려고 할 때
- Put : 무언가를 업데이트, 수정할 때 요청
- Delete : 서버에 무언가를 지우려고 요청
- Head : Header에 있는 것을 요구
웹브라우저(인터넷) 주소창에서 ' localhost:3000 '을 입력하면 get에 입력한 'Hello World'가 출력된다
-> 주소창에 입력하는것이 Get 방식이다
▣ Query String방식으로, 서버접속시 파라미터를 주어 서버에 출력해보기
-> 주소창에 ' localhost:3000?num1=10&num2=15 '와 같이 숫자 2개를 서버로 보내, 서버에서 출력되게
var express = require('express');
var app = express();
app.get('/', function (req, res) {
console.log('num1 = %d, num2 = %d', req.query.num1, req.query.num2); // req요청의 query값인 num1, num2
res.send('Hello World'); // JS는 "" 와 '' 의 구별이 없다
});
app.listen(3000, function(){
console.log('Example app listening on port 3000!');
});
->VS Code Terminal에서 아래와 같이 출력된다
Example app listening on port 3000!
num1 = 20, num2 = 11
▣ 이번에는 파라미터 2개의 합을 클라이언트로(접속을 시도한 웹브라우저에) 출력해주기
var express = require('express');
var app = express();
app.get('/', function (req, res) {
console.log('num1 = %d, num2 = %d', req.query.num1, req.query.num2);
res.send((req.query.num1*1 + req.query.num2*1)+"");
});
app.listen(3000, function(){
console.log('Example app listening on port 3000!');
});
----------------------------------------------------강사님 답안--------------------------------------------------------------------
var express = require('express');
var app = express(); // express 의 Top level 함수
app.get('/', function (req, res) {
console.log('num1 = %d, num2 = %d', req.query.num1, req.query.num2);
var num1 = parseInt(req.query.num1);
var num2 = parseInt(req.query.num2);
var msg = '';
msg = num1 + " + " + num2 + " = "+ (num1+num2);
res.end(msg); // send = end 똑같이 클라이언트에 보낸다
});
app.listen(3000, function(){
console.log('Example app listening on port 3000!');
});
--------------------------------------------------------------------------------------------------------------------------------------
▣ 브라우저에 출력되는 문장 색 바꾸기
msg = num1 + " + " + num2 + " = "+ (num1+num2);
var html = ''; '< div style="color:red;">'+msg+'< / div >';
res.writeHead(200, {'Content-Type':'text/html'}); // 200 = 정상처리되었다를 의미 다른 숫자들은 err를 의미
res.end(html); // send = end 똑같이 클라이언트에 보낸다
--------------------------------------------------------------------------------------------------------------------------------------
▣ 데이터를 JSon 방식으로 받기?(get방식)
var express = require('express');
var app = express();
app.get('/', function (req, res) { // Get!
console.log('num1 = %d, num2 = %d', req.query.num1, req.query.num2);
var num1 = parseInt(req.Parmas.num1);
var num2 = parseInt(req.Parmas.num2);
var msg = '';
msg = num1 + " + " + num2 + " = "+ (num1+num2);
var html = '< div style="color:red;">'+msg+'< / div >';
res.writeHead(200, {'Content-Type':'application/json'});
var jsonObj = {};
jsonObj.num1 = num1;
jsonObj.num2 = num2;
res.end(JSON.stringify(jsonObj));
});
app.listen(3000, function(){
console.log('Example app listening on port 3000!');
});
--------------------------------------------------------------------------------------------------------------------------------------
path형식의 데이터 전달 반식?
- app.get('/', function (req, res)을 변경하면 주소창에 파라미터 입력 받는 것을 다르게 할 수 있다
-> app.get('/app/:num1/:num2'), function (req, res) 라고 한 후
console.log('num1 = %d, num2 = %d', req.query.num1, req.query.num2)에 있는 query를 params로 변경한다
그리고 주소창에 http://localhost:3000/app/3/5 라고 하면 끝
정리
var express = require('express');
var app = express();
app.get('/app/:num1/:num2', function (req, res) {
console.log('num1 = %d, num2 = %d', req.params.num1, req.params.num2);
var num1 = parseInt(req.params.num1);
var num2 = parseInt(req.params.num2);
res.writeHead(200, {'Content-Type':'application/json'});
var jsonObj = {};
jsonObj.num1 = num1;
jsonObj.num2 = num2;
res.end(JSON.stringify(jsonObj));
});
app.listen(3000, function(){
console.log('Example app listening on port 3000!');
});
--------------------------------------------------------------------------------------------------------------------------------------
▣ html로 로그인 창 만들기
- login_form.html로 아래 문장 저장
- node npm install fs --save을 VSCode에서 실행
- 아래 코드로 이루어진 express_login.js 생성
var express = require('express');
var app = express();
var fs = require('fs');
var qs = require('querystring');
app.post('/login', function(request, response){
var body = '';
request.on('data', function(data){
body += data;
if(body.length > 1e6) request.connection.destroy();
});
request.on('end', function(){
var post = qs.parse(body);
console.log("name = %s, email = %s", post.name, post.email);
response.writeHead(200, {"Content-Type": "application/json"});
response.end(JSON.stringify(post));
});
});
app.get('/form', function(request, response){
response.writeHead(200, {"Content-Type": "text/html"});
fs.createReadStream("./login_form.html").pipe(response);
});
app.listen(3000, function(){
console.log('Example app listening on port 3000!');
});
- VSCode에서 'node express_login.js'를 실행
-> " Example app listening on port 3000! " 로그가 뜬다
-> 익스플로러 주소창에 " http://localhost:3000/form " 를 입력한후 로그인 버튼을 누르면 화면에 로그인 정보가 보인다!
--------------------------------------------------------------------------------------------------------------------------------------
▣ Oracle DB와 연동
var express = require('express');
var app = express();
var fs = require('fs');
var qs = require('querystring');
app.post('/login', function(request, response){
var body ='';
request.on('data', function(data){ // 데이터가 수신되면
body += data;
if (body.length > 1e6) // 1e6 = 1 × 10^6 = 1,000,000 = 약 1mb
requset.connection.destroy();
});
request.on('end', function () {
var post = qs.parse(body);
console.log('User ID=%s, User Pass=%s', post.userID, post.userPass); // post.userId/Pass은 html에 적혀있는 변수
response.writeHead(200, {"Content-Type": "application/json"});
login(post.userID, post.userPass, response); // Login 함수 호출 밑에서 새로 정의한다
});
});
app.get('/form', function(request, response){
response.writeHead(200, {"Content-Type": "text/html"});
fs.createReadStream("./login_form.html").pipe(response); // pipe(response)를 통해 login_form.html이 client 화면으로 보내진다
});
app.listen(3000, function(){
console.log("Example app listening on port 3000!");
});
function login(empId, empName, res) // Login 함수 정의
{
const oracledb = require('oracledb'); // 지난번 OracleDB에 연동하여 사원정보를 불러왔던 때의 그것 그대로다
oracledb.getConnection(
{
user :"hr",
password :"1111",
connectString:"127.0.0.1/XEPDB1"
},
function(err,connection)
{
if(err){
console.error(err.message);
return;
}
connection.execute( // 지난번과는 여기서 부터 차이가 난다
'SELECT * FROM player WHERE pid = :a and pass = :b',
[empId,empName],
{
maxRows:1
},
function(err,result)
{
var jsonObj = {};
if(err){
console.error(err.message);
connection.close();
jsonObj.result = "Login Failed";
return;
} else{
console.log(result.rows);
connection.close();
if(result.rows.length>0)
{
console.log("검색 성공");
jsonObj.result = "Login Succeeded";
} else{
console.log("검색 실패");
jsonObj.result = "Login Failed";
}
}
res.end(JSON.stringify(jsonObj)); // JSON.stringfy = JSON 오브젝트를 string화(문자열화)한다
});
});
}