Sevity Blog

MSA구조에서 쿠키를 다루다가 CORS (Cross-Origin Resource Sharing) 문제를 피하기 위해서

https로 변경이 필요해서 시도해 보게 되었다.

서버사이드는 여기 참조

먼저 인증서를 발급한다.

개발용 인증서를 생성하기 위해 openssl을 사용할 수 있습니다. 터미널에서 아래 명령을 실행

openssl req -x509 -newkey rsa:4096 -keyout key.pem -out cert.pem -days 365

암호를 입력하라는 창이뜬다.

이 명령은 1년 동안 유효한 cert.pem과 key.pem 파일을 생성

기존에 npm start로 시작했다면, 아래처럼 start대신 server.js로 변경

다음처럼 server.js를 작성하고, project root에 둔다.

console.log('sevity Server is starting...');

const { createServer } = require('https');
const { parse } = require('url');
const next = require('next');
const fs = require('fs');

const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();

app.prepare().then(() => {
    const options = {
        key: fs.readFileSync('./key.pem'),
        cert: fs.readFileSync('./cert.pem'),
        passphrase: 'abcd123$'
    };

    createServer(options, (req, res) => {
        const parsedUrl = parse(req.url, true);
        handle(req, res, parsedUrl);
    }).listen(9992, (err) => {
        if (err) throw err;
        console.log('> Ready on https://localhost:9992');
    });
});

npm start로 시작해보면 http대신 https로 되는걸 확인가능.

F5를 눌러서 라인디버깅이 가능한 디버거를 띄우기 위해서는,

먼저 package.json에서 다음 부분을 수정해준다.

  "scripts": {
    "dev": "NODE_OPTIONS='--inspect' next dev",
    ...
  },

그 다음, vscode에서 launch.json을 만든다음(이건 그냥 F5누르고 node.js눌러도 기본템플릿은 만들어준다.)

다음 내용을 써준다.

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Next.js",
            "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/next",
            "cwd": "${workspaceRoot}",
            "console": "integratedTerminal",
            "internalConsoleOptions": "neverOpen",
            "skipFiles": ["<node_internals>/**"]
        },
    ]
}

위처럼 하면 기본적인 디버깅환경은 구축이 된 것이고, Ctrl+F5로 실행하면  break포인트가 잡히지 않는다.

하지만 론치과정이 단순히 npm run dev하는 것 보다는 헤비하기 때문에 Ctrl+Shift+B를 눌러서 가볍게 실행하고 싶으면,

다음처럼 launch.json과 같은곳에 tasks.json을 만들어 준다.

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "Run Next.js Without Debugging",
            "type": "shell",
            "command": "npm",
            "args": ["run", "dev"],
            "problemMatcher": [],
            "group": {
                "kind": "build",
                "isDefault": true
            }
        }
    ]
}