TIL 21.05.28


今日やったこと
ああ、サーバーを構築しました.
早すぎるかどうかはよくわかりませんが
nodejsを介してサーバを構築する方法をいくつか試みた.
Achievement Goals
△これは理解しているからかもしれませんが、間違っています.勉強を続けて修正します.
  • node.jsモジュール
  • の使用
  • node.jsの内蔵httpモジュールを使用できます.
  • httpモジュールを使用する場合、サーバにCORSを設定できます.
  • CommonJSを使用してモジュールをエクスポート/ロードできます.
  • ルーティングおよびAPI
  • ルーティング(条件付きブランチ)を理解し、サーバコードで実装します.
  • クライアントで使用できるサーバAPIドキュメントを直接作成できます.
  • Expressライブラリ
  • expressライブラリがどのタスクを簡単にするか理解できます.
  • ミドルウェアの概念は理解できる.
  • Node js modules
    Node.jsはChrome V 8 JavaScriptエンジンによって構築されたJavaScriptランタイム環境である.
    主にサーバ側アプリケーション開発に用いられるソフトウェアプラットフォーム.
    Node.jsにはhttpサーバモジュールが内蔵されており、apacheのような個別のWebサーバをインストールする必要はありません.
    さらにnpmでより簡潔に再パッケージできるExpressフレームワークをダウンロードすることができます.
    Routing
    クライアントは、HTTPリクエストを特定のHTTPリクエストメソッド(GET、POSTなど)またはサーバの特定のURI(またはパス)に送信する.
    ルーティングは、クライアント要求の方法およびエンドポイントに基づいてサーバ応答を決定する方法である.
    http module
    まず、httpモジュールを使用してHTTPサーバを作成し、jsファイルを使用してWebサーバを構築できます.
    まず、モジュールを読み込み、サーバを作成する必要があります.
    const http = require("http");
    JavaScriptの開発では、requireキーやimportキーで外部ライブラリをロードするコードがよく見られます.
    requireはNodeJSで使用されるCommonJSキーワードです.
    httpモジュールはhttpという変数で有効です.createServer()メソッドによる
    サーバー・オブジェクトを作成します.
    その後、listen()メソッドでサーバを実行し、リクエストを待つことができます.
    Listenのパラメータは、使用するポート番号とipアドレスを入力すればよい.
    const PORT = 5000;
    const ip = 'localhost';
    
    const http = require('http');
    
    const server = http.createServer((request, response) => {
      // do something(라우트작업)
    });
    
    server.listen(PORT, ip, () => {
      console.log(`http server listen on ${ip}:${PORT}`);// 서버가 잘 실행되었는지 확인하기위함
    });
    サーバが正常に作成された場合は、要求と応答を受信して処理する必要があります.
    httpモジュールは、要求(要求)オブジェクトと応答(応答)オブジェクトによってhttpメッセージを処理する.
  • requestオブジェクト
    クライアントがサーバに送信するメッセージ(情報)を含むオブジェクト.
    ツールバーの
    方法:クライアント要求方式でGET、POSTを行う.
    url:クライアントリクエストのURLを表します.
    headers:リクエストメッセージヘッダを表します.
    url.parse():URLの形式を解析します.
    url.parse().pathname : "/blog/index.nhn"
  • 応答オブジェクト
    サーバからクライアントに応答メッセージを送信するオブジェクト.
    ツールバーの
    writeHead():レスポンスヘッダを記述します.
    end():応答本文(body)を作成します.
  • 以上の2つのオブジェクトでCORSを設定します(例:フリーフライトのリクエスト)
    if (request.method === 'OPTIONS'){// <- 프리플라이트 요청은 제일먼저 OPTIONS 메소드를 보내 사전 요청을 한다.
      response.writeHead(200, defaultCorsHeader);// <- 응답 헤더작성 첫번째 인자는 http 상태코드, 두번째 인자는 응답 헤더의 내용
      response.end('OK')// <- 응답 헤더의 본문(body)
    }
    
    const defaultCorsHeader = { //<- 응답 메세지에 보낼 Header 구성
      "Access-Control-Allow-Origin": "*", 
      //서버가 어떤 출처를 허용하는 지(*: 모든출처를 허용한다는 뜻)
      "Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, OPTIONS",
      //어떤 메소드를 받을 수 있는지
      "Access-Control-Allow-Headers": "Content-Type, Accept",
      // 어떤 헤더 속성을 허용하는지
      "Access-Control-Max-Age": 10,
      //통신 최대 지연 시간 (통신 지연이 10초 이상 delay되면 연결이 끊긴다.)
    };
    Express framework
    expressフレームワークはhttpモジュールのようにサーバモジュールです.
    httpとは異なり、httpモジュールのみを使用してWebサーバを構成する場合は、多くの機能を直接開発する必要があります.
    Expressは、Webアプリケーションおよびモバイルアプリケーションに実装済みのモジュールを提供します.
    シンプルで柔軟なノード.js Webアプリケーションのフレームワークが大きい.
    Expressでは、Webサーバの機能の大部分を簡単なコードで実現できます.
    ミドルウェアとrouterを使用すると、Webサーバを容易に構成できます.
    const requestHandler = (req, res) => {
      if(req.url === '/lower') {
        if (req.method === 'GET') {
          res.end(data)
        } else if (req.method === 'POST') {
          req.on('data', (req, res) => {
            // do something ...
          })
        }
      }
    }
    httpモジュールによるオンデマンドルーティングコードの実装
    const router = express.Router()
    
    router.get('/lower', (req, res) =>{
      res.send(data)
    })
    
    router.post('/lower', (req, res) =>{
      // do something
    })
    Expressのルータ機能を使用して再パッケージ
    middle ware
    Mediaware関数は、リクエストオブジェクト(req)、レスポンスオブジェクト(res)、およびアプリケーションのリクエスト応答サイクルで次のミドルウェア関数にアクセスする関数です.
    この言葉はちょっと難しいですが、expressのルータ메소드(url, 콜백함수)形式では
    ミドルウェア関数がパラメータに入り、任意の動作を行うことを理解すればよい.
    これらのミドルウェア関数は、実装済みでも新しく作成されてもよい.
    const cors = require('cors')
    
    // 생략
    app.use(cors()) // 모든 요청에 대해 CORS 허용
    const cors = require('cors')
    
    // 생략
    // 특정 요청에 대해 CORS 허용
    app.get('/products/:id', cors(), function (req, res, next) {
      res.json({msg: 'This is CORS-enabled for a Single Route'})
    })
    corsを処理するミドルウェア関数が実装されており、それをインポートして適用することができます.
    従来のHTTPモジュールは、corsを処理するためにヘッダ定義およびOPTIONSメソッドのルーティングも実現している.
    しかしexpressではcors()ミドルウェア関数が実現されており,それをインポートして使用するだけでよい.
    const myLogger = function (req, res, next) {
      console.log('LOGGED'); 
      // 이 부분을 req, res 객체를 이용해 고치면, 모든 요청에 대한 로그를 찍을 수 있습니다.
      next();
    };
    
    app.use(myLogger);
    ミドルウェア関数の作成例
    まず適切な機能の関数を宣言し,use()メソッドに入れればよい.
  • expressメソッド
    use():ミドルウェア関数を使用します.
    set():サーバ設定のプロパティを指定します.
    リダイレクト():Webページのパスを強制的に移動します.
    send():応答データをクライアントに送信します.
    ヘッダー():ヘッダーを確認します.
  • コメントサイト
    https://nodejs.org/ko/docs/guides/anatomy-of-an-http-transaction/
    https://www.daleseo.com/js-module-require/
    https://edu.goorm.io/learn/lecture/557/%ED%95%9C-%EB%88%88%EC%97%90-%EB%81%9D%EB%82%B4%EB%8A%94-node-js/lesson/21938/%EB%85%B8%EB%93%9C%EC%9D%98-%EB%AA%A8%EB%93%88-%EA%B0%9C%EB%85%90
    https://velog.io/@zlor26/http-%EB%AA%A8%EB%93%88%EA%B3%BC-express-%EB%AA%A8%EB%93%88-%EC%B0%A8%EC%9D%B4
    https://expressjs.com/ko/starter/hello-world.html
    https://www.youtube.com/watch?v=sB5YRnrp0H4