생활코딩

Coding Everybody

코스 전체목록

닫기

Node.js - 웹서버 만들기

수업소개

Node.js는 웹서버 기능을 가지고 있습니다. 이런 특성을 이용해서 컨텐츠를 프로그래밍적으로 생산할 수 있게 됩니다. 여기서는 Node.js를 웹서버로 구동하는 방법을 살펴보겠습니다. 

 

 

 

강의

 

 

 

소스코드

아래의 코드 중 9행의 내용은 아래와 같이 변경해야 합니다. 

response.writeHead(404);
response.end();
return;


 

var http = require('http');
var fs = require('fs');
var app = http.createServer(function(request,response){
    var url = request.url;
    if(request.url == '/'){
      url = '/index.html';
    }
    if(request.url == '/favicon.ico'){
      return response.writeHead(404);
    }
    response.writeHead(200);
    response.end(fs.readFileSync(__dirname + url));

});
app.listen(3000);

 

 

 

참고

web1 - HTML & Internet 수업의 소스코드

 

댓글

댓글 본문
  1. Sansol Park
    __dirname과 __filename은 Node.js에서 제공하는 전역변수로, 각각 현재 실행중인 스크립트가 있는 디렉토리의 절대 경로와 파일 경로를 나타냅니다.

    __dirname: 현재 실행 중인 스크립트가 포함된 디렉토리의 절대 경로입니다. 예를 들어, /home/user/myapp/main.js 스크립트에서 __dirname을 사용하면 /home/user/myapp이 됩니다.
    __filename: 현재 실행 중인 스크립트의 절대 경로입니다. 위 예제의 경우 __filename은 /home/user/myapp/main.js가 됩니다.
    이 차이 때문에 __dirname + url을 사용하면 요청받은 URL에 해당하는 파일을 현재 스크립트가 있는 디렉토리에서 찾아 반환합니다. 예를 들어, 요청 URL이 /일 때 index.html 파일을 /home/user/myapp/index.html에서 찾아 브라우저에 제공합니다.

    반면, __filename을 사용하는 경우는 현재 실행 중인 파일의 경로를 기준으로 하기 때문에, __filename 자체가 이미 파일을 가리키고 있습니다. 따라서 __filename을 사용해 파일의 내용을 읽어와서 반환하려 하면, 현재 실행 중인 main.js 파일의 코드가 읽혀지게 되어, 브라우저에서는 index.html의 내용 대신 main.js의 소스 코드가 표시됩니다.

    즉, __dirname은 디렉토리 경로만을 반환하므로 경로에 파일 이름을 추가하여 파일 위치를 지정할 수 있지만, __filename은 이미 파일을 포함한 전체 경로를 반환하기 때문에, URL을 처리하여 다른 파일을 서빙하기 위해서는 적절하지 않습니다. 이 때문에 __filename을 사용했을 때와 __dirname + url을 사용했을 때 브라우저에서 보이는 내용이 다른 것입니다.

    GPT4 를 활용한 답변입니다.
    대화보기
    • 비전공자
      오후 9:52 2024-04-07
    • 심해
      __dirname 이 현재 실행중인 코드의 폴더경로를 나타내는 전역변수잖아요, 그래서 그 폴더에 url 정보를 합해서 경로를 지정하여 readFileSync메소드로 해당경로의 파일을 읽어들여서 화면에 띄우는 것까지는 이해했어요. 그런데 __dirname말고 __filename은 실행중인 코드의 파일경로를 나타내는 전역변수인데 이것을 사용해서 실행시켜보니 주소창에 경로는 똑같이 http://localhost......tml 라고 뜨는데 __filename을 이용한 경우는 index.html 파일이 실행된 모습이 아닌 main.js 파일의 코드가 브라우저 화면에 뜹니다.
      정리하면, __dirname + url 을 한것이나, __filename을 사용한 것이나 둘다 브라우저 주소창의 경로에는 똑같이 http://localhost......tml 라고 떴는데 __filename을 사용한 경우에는 왜 브라우저 화면에 다르게 뜨는건가요??
    • 코코
      24.02.20
    • Sansol Park
      Codeanywhere는 웹 기반의 코드 편집기로, 여러 가지 프로그래밍 언어를 지원하며 파일 및 디렉토리를 추가하는 기능을 제공합니다. 파일을 추가하는 방법은 아래와 같습니다:

      Codeanywhere를 연 후, 파일을 추가하려는 프로젝트 또는 디렉토리를 찾아 클릭합니다.
      찾은 프로젝트 또는 디렉토리를 우클릭하면 컨텍스트 메뉴가 열립니다.
      컨텍스트 메뉴에서 'New File'을 선택하면 새 파일이 추가됩니다.
      새로 생성된 파일의 이름을 변경하려면 파일을 우클릭하고 'Rename'을 선택한 후 원하는 이름을 입력하고 Enter 키를 누르면 됩니다.
      참고로, 'New Folder' 옵션을 선택하면 새 디렉토리를 생성할 수 있습니다. 이렇게 Codeanywhere에서는 간단한 몇 단계만으로 파일 및 디렉토리를 추가할 수 있습니다.

      GPT-4의 답변입니다.
      대화보기
      • Sansol Park
        다른 컴퓨터에서 웹서버에 접근하지 못하는 문제는 일반적으로 네트워크 설정, 방화벽 설정, 또는 IP 주소와 포트 번호 지정 문제 등에 의해 발생할 수 있습니다.

        네트워크 설정: 서버가 실행되는 컴퓨터와 접속을 시도하는 컴퓨터가 같은 네트워크에 있는지 확인해야 합니다. 또한, 서버 컴퓨터의 IP 주소가 올바르게 설정되어 있는지 확인해야 합니다.

        방화벽 설정: 서버 컴퓨터의 방화벽 설정이 외부 접속을 허용하도록 설정되어 있는지 확인해야 합니다. 특히, Node.js가 사용하는 포트(위 예시에서는 3000)가 방화벽에 의해 차단되지 않았는지 확인해야 합니다.

        IP 주소와 포트 번호: Node.js 서버를 실행할 때 IP 주소와 포트 번호를 올바르게 지정해야 합니다. 일반적으로, 로컬 네트워크에서만 접근 가능한 서버를 실행할 때는 'localhost' 또는 '127.0.0.1'을 사용하지만, 외부 네트워크에서 접근 가능한 서버를 실행할 때는 실제 IP 주소를 사용해야 합니다.

        위의 문제들을 확인해보시고, 여전히 문제가 해결되지 않는다면 추가적인 정보(예: 서버 및 클라이언트의 운영체제, 네트워크 설정, 방화벽 설정 등)를 제공해 주시면 더 구체적인 도움을 드릴 수 있을 것 같습니다.

        GPT-4의 답변입니다.
        대화보기
        • 김철흥
          2024.01.08
          완료!
        • Hoon Ko
          20231015
        • Hoon Ko
          20231015
        • carpediem
          23.09.02 완료!
        • Sansol Park
          9행의 수정 이유는 favicon.ico 요청에 대한 처리를 올바르게 하기 위함입니다.
          주어진 코드에서, 9행의 return response.writeHead(404);는 즉시 404 응답 코드를 반환합니다. 그러나 이렇게 작성하면 응답 헤더만 전송되고, 응답 본문을 전송하지 않습니다.
          이를 수정하기 위해, 원래 코드를 분리하여 응답 헤더와 응답 본문을 한 줄로 작성하지 않고 각각 작성합니다. 변경한 코드에서는, response.writeHead(404);로 404 응답 헤더를 전송하고, 바로 다음 줄에서 response.end();를 호출하여 응답 본문을 종료하고 전송합니다.
          따라서 웹 브라우저 상에서 favicon.ico 파일이 없어도 페이지에 올바르게 접근할 수 있습니다.
          대화보기
          • helloworldjs
            9행을 수정해야 하는 이유는 무엇인가요?
          • 어흥
            23.06.26
          • 나그네
            강좌 잘 보고있습니다....감사합니다..
            근데 자체 리눅스 서버의 브라우저에서는 화면이 나오는데...
            다른 컴퓨터에서는 웹서버를 찾지를 못하네요...
            뭘 잘못한걸까요?....도와주세요...
          • shady00
            Atom으로 안하고 Codeanywhere 에서 하고 있는데
            Codeanywhere에서는 파일추가(6개파일) 어떻게 하는건가요??
          • 백대진
            0223-01-18 완
          • Darcy
            recap하러 왔어요 ~
          • 2022.12.27
          • 감자
            22.11.30 완료
          • 드가자
            g하하
          • 당당
            2022.10.14
          • sosoCoding
            2022.09.20 료완
          • 뿔고래
            nodejs는 만능인 것 같다.
          • Sukjoon Lee
            2022.08.11
          • i_am_es
            2022-08-04
          • 아캔두잇
            20220804 완료
          • 돈버는기계왕
            localhost 3000이 사용중이라서 그럴 겁니다.

            다른 수업들으면서 3000을 사용한채로 키고 오신거 같은데요
            대화보기
            • 키다리아저씨
              220714 완
            • toonfac
              220704 오전 2시 34분 완료
            • LLLEE
              22.06.23 완료 맨날 리액트 실행시킬때 yarn start로 무지성으로 했는데 그 근본이 이거 였군요. 재밌네요. 좋은 강의 감사합니다.
            • 이성훈
              2022/06/22 벌써 흥미롭네요! c언어 구조체 배우다가 하니까 너무 재밌어요~
            • yjchun26
              2022/03/27 완료
            • 코지마 히데오 뺨 후릴 반바지
              마지막 부분이 이해가 잘 안간다. 일단은 계속 진행해보면서 이해해볼려고 한다.
            • chloekim66
              이강의랑 웹애플리케이션만들기랑 뭐가다른건가요 ???
            • Scia
              저는 9행 수정하라는거 안 해도 되던데...
              왜 수정해야하는 건지 아시는 분 있으신가요?
            • 화려하게간다
              호우 슬슬 ㅋㅋㅋㅋㅋㅋㅋ
            • 밍기
              2022-01-06 완료
            • 소설가
              2021-12-30 완료
              고맙습니다.
            • guma
              맥 터미널에서 폴더경로이동은 cd (change directory)

              cd desktop/상위폴더/하위폴더 해서 본인이 저장한 폴더로 이동 후
              node main.js 하면 사이트 표시됨
            • 김관호
              2021.11.23
            • 솔나무
              예에
            • 칸타타
              저걸 아통에서 해야하는지 비주얼스튜디오에서 해야하는지요?
            • 동넝이
              21.10.11 완료
            • mijien0179
              궁금한게 있어요, 파비콘을 호출할 때 404 not found 코드를 넣는데, 왜 그런건가요? 아직 따로 파비콘을 지정하지 않은 상태라서 그런건가요?
            • 야옹스
              20211009!
            • inventorh
              2021.10.3 좋은강의 감사합니다
            • 20 단붕
              21.09.30
            • pdpd
              210921 달리자
            • 전해성
              21.09.12 완료
            • 졸작완성하자
              21.09.05 완료
            버전 관리
            egoing@gmail.com
            현재 버전
            선택 버전
            graphittie 자세히 보기