개발하는 망나뇽 개발하는 망나뇽

Node.js,MongoDB

• socket.io (실시간 데이터 주고받기)

  Node.js,MongoDB 2022. 4. 27. 12:52

  실시간으로 소통할 때 SSE말고도 WebSocket을 쓰면 서버, 유저간 실시간 통신이 가능하다. Server Sent Event는 서버 -> 유저의 일방적 통신이라면, WebSocket는 양방향 통신이 가능하다. 생js로 할 순 있는데, 라이브러리 사용이 편리하다. npm install socket.io 먼저, socket.io를 설치해준다. 그리고, const http = require('http').createServer(app); const { Server } = require("socket.io"); const io = new Server(http); 셋팅을 해준다. 세줄은 const app = express(); 밑에 작성해야 한다. 마지막으로, //app.listen(8080, functio..

  Read More
• 채팅기능 만들기 (DB변동사항 실시간 업데이트)

  Node.js,MongoDB 2022. 4. 27. 09:49

  var 지금누른채팅방id; //변수가 밖에 있으니 함수들안에도 사용가능 var eventSource; $('.list-group-item').click(function(){ 지금누른채팅방id = this.dataset.id; $('.chat-content').html(''); if (eventSource !== undefined) { eventSource.close() } eventSource = new EventSource('/message/' + 지금누른채팅방id)//실시간 소통채널 입장 eventSource.addEventListener('test', function(e){ var 가져온거 = JSON.parse(e.data) //서버에서 보낸 데이터 따옴표를 제거서 받음 //동적으로 html생성하..

  Read More
• 채팅기능 만들기 (서버와 실시간 소통 SSE)

  Node.js,MongoDB 2022. 4. 25. 13:30

  저번에 까지 전송 버튼을 누르면 서버에 저장하게끔 코드를 작성했다. 이제, 채팅방을 누르면 메세지를 보여줘야 한다. 근데 실시간으로 가져와야 한다. 2가지 방법이 있는데, 먼저, get요청을 1초마다 계속 날리는 방법이 있다. 이 방법은 요청이 많이지면 힘든 방법이다. 그래서, 실시간 소통채널을 여는 (Server Sent Event)라는 방법이 있다. server.js에 app.get('/message/:id', 로그인했니, function(요청, 응답){ 응답.writeHead(200, { //Header을 설정해주세요 란 뜻 "Connection" : "keep-alive", "Content-Type" : "text/event-stream", "Cache-Control" : "no-cache", }..

  Read More
• 채팅기능 만들기 (메시지 발행)

  Node.js,MongoDB 2022. 4. 25. 01:33

  채팅방1 내용 채팅방1 내용 채팅방1 내용 전송 input태그에 글을 써서 댓글을 다는 것도 게시물 발행과 같다. 우선 html을 짜고 전송버튼을 눌렀을 때 서버로 보낼 데이터를 정리해보자. var 지금누른채팅방id; //변수가 밖에 있으니 함수들안에도 사용가능 $('.list-group-item').click(function(){ 지금누른채팅방id = this.dataset.id; }) $('#send').click(function(e){ //당한id, 부모요소, 내id, content, date var 보낼거 = { parent : 지금누른채팅방id,//보통 카톡도 채팅방부터 클릭하고 메세지 작성함 content: $('#chat-input').val(), } $.post('/message', 보낼거..

  Read More
• 채팅기능 만들기 (채팅방만들기)

  Node.js,MongoDB 2022. 4. 22. 10:11

  채팅기능도 게시물 발행과 똑같다. 그저 내용을 발행해주면 된다. 그리고 대부분의 기능들도 각각의 정보를 발행시켜주는 것이라 게시물 발행과 근본적으로 같다. 채팅기능 +로 1. 게시물간 관계맺기 2. DB실시간 업데이트 이 두개를 더해야 한다. 이제, 종속관계에 대해 알아보자 댓글기능을 예를 들어 알아보자. 댓글기능은 채팅기능과 같은데 실시간만 추가되었을 뿐이다. 댓글은 단독으로 존재할 수 없고, 해당글에 달린 댓글을 구별해야 한다. 즉, 어디에 달린 댓글인지 알아야한다. 이걸 관계맺는다고 표현하다. 이처럼 게시물간의 종속관계를 표현하고 싶을 때 부모정보까지 같이 저장하면 된다. 먼저, 채팅하기 채팅하기란 버튼을 만들고, ajax요청을 통해 서버로 보내보자 $('.chat').click(function(e..

  Read More
• 쇼핑몰 등 실제 서비스에서 질문등?

  Node.js,MongoDB 2022. 4. 20. 12:50

  1. Mongoose는 필수? MongoDB에 데이터를 넣고 뺄 때 라이브러리 2개 중 1개를 택할 수 있다. MongoDB Native Driver과 Mongoose가 있다. MongoDB Native Driver는 지금까지 사용한 것인데, 둘의 관계는 js와 jQuery같은 관계이다. Mongoose를 사용하면 약간 편해지며 validation(데이터 검증 작업 예를 들면, 한글아이디 입력을 막는것)이 쉬워진다. MongoDB Compass를 이용하면 Mongoose처럼 쉽게 사용할 수 있어서 필수는 아니다. 2. 보안은? 악성유저가 되어서 사이트를 테스트해보면 쉽다. 예를 들면, 회원가입시 너무 긴 아이디를 넣는다거나, 영어를 넣어야할 곳에 한글을 넣거나 이런건 if문으로 검사하면 끝이다. 이런 것..

  Read More
• 이미지 업로드 & 이미지 서버 만들기

  Node.js,MongoDB 2022. 4. 19. 03:13

  이미지 업로드기능을 만들어보자. upload.ejs라는 폴더를 만들고, 업로드페이지 // enctype="application/x-www-form-urlencoded"얘는 인코딩이 된 형식으로 보낼거냐 //근데 보통은 multipart/form-data 인코딩하지말고 그대로 전송함 전송 form태그를 이용해서 업로드하는 곳을 만들어준다. input태그에 type을 file로 하면 이미지를 업로드할 수 있다. 그리고, server.js에 get요청을 해준다. app.get('/upload', function(요청, 응답) { 응답.render('upload.ejs') }) /upload에 들어가면 upload.ejs파일을 불러오게끔 해준다. 이제 업로드는 할 수 있는데 업로드한 이미지를 저장해야한다. 보통..

  Read More
• 구글클라우드 사용법

  Node.js,MongoDB 2022. 4. 19. 01:51

  구글클라우드로 서버에 배포해보자. 1. server.js와 같은 위치에 app.yaml 파일을 만들어주고, runtime: nodejs env: flex manual_scaling: instances: 1 resources: cpu: 1 memory_gb: 0.5 disk_size_gb: 10 내용을 복사해준다. 2. 서버 포트가 8080인지 확인해준다. 구글클라우드가 기본적으로 사용하는 포트가 8080이기 때문이다. 3. MongoDB Atlas에서 Network Access메뉴에서 Whitelist IP를 모든아이피에서 허용으로 변경해준다. 여기서 아이피를 0.0.0.0으로 바꿔준다. 4. google cloud에 로그인하고 새로운 프로젝트를 만들거나 기존 프로젝트를 선택한다. 그 다음, App En..

  Read More