Merge pull request #6 from code-yeongyu/naver-2fa

사용자는 `rxjs` subscription 을 활용해 네이버 2중 인증으로도 로그인 할 수 있습니다.

Author: code-yeongyu

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "editor.tabSize": 2
+}

codecov.yml

@@ -0,0 +1,4 @@
+coverage:
+  status:
+    project: no
+    patch: no

example/naver/printPaymentHistory.ts

@@ -18,7 +18,7 @@ const printNaverPayHistory = async (id: string, password: string) => {
   const module = NaverApp.ModuleFactory.create(page);
   const crawlService = new NaverApp.Service(module);
 
-  await crawlService.login(id, password);
+  await crawlService.normalLogin(id, password);
 
   const history = await crawlService.getHistory();
   console.log(history);

example/naver/reactivelyPrintPaymentHistory.ts

@@ -0,0 +1,56 @@
+import puppeteer from "puppeteer";
+import { NaverApp } from "trackpurchase";
+
+import readline from "readline";
+import { concat, defer, filter, from, tap } from "rxjs";
+
+const printNaverPayHistory = async (id: string, password: string) => {
+  const MOBILE_UA =
+    "Mozilla/5.0 (iPhone; CPU iPhone OS 15_1_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.1 Mobile/15E148 Safari/604.1";
+
+  const browser = await puppeteer.launch({
+    headless: false,
+    args: ["--start-maximized"],
+  });
+
+  const page = await browser.newPage();
+  await page.setViewport({ height: 800, width: 1200 });
+  await page.setUserAgent(MOBILE_UA);
+
+  const module = NaverApp.ModuleFactory.create(page);
+  const crawlService = new NaverApp.Service(module);
+
+  const loginEvent$ = crawlService.interactiveLogin(id, password);
+  const history$ = defer(() => from(crawlService.getHistory()));
+  const closePage$ = defer(() => from(page.close()));
+  const closeBrowser$ = defer(() => from(browser.close()));
+
+  const final$ = concat(loginEvent$, history$, closePage$, closeBrowser$).pipe(
+    tap((event) => {
+      if (event === "otp-required") {
+        console.log("스마트폰 앱에서 OTP 인증을 완료해주세요.");
+      }
+    }),
+    tap((event) => {
+      if (event === "manual-otp-required") {
+        rl.question("otp code: ", async (code) => {
+          module.pageInteractor.fillManualOTPInput(code);
+        });
+      }
+    }),
+    filter((event) => event instanceof Array)
+  );
+  final$.subscribe((event) => {
+    console.log(event);
+  });
+};
+
+const rl = readline.createInterface({
+  input: process.stdin,
+  output: process.stdout,
+});
+rl.question("Naver ID: ", (id) => {
+  rl.question("Naver Password: ", (password) => {
+    printNaverPayHistory(id, password);
+  });
+});

package.json

@@ -1,6 +1,6 @@
 {
   "name": "trackpurchase",
-  "version": "0.1.14",
+  "version": "1.0.0",
   "main": "dist/index.js",
   "license": "MIT",
   "repository": {
@@ -21,7 +21,11 @@
     "preset": "jest-puppeteer",
     "coveragePathIgnorePatterns": [
       "dist/",
-      "elementParser.ts"
+      "elementParser.ts",
+      "pageInteractor.ts"
+    ],
+    "testPathIgnorePatterns": [
+      "dist/"
     ]
   },
   "scripts": {
@@ -30,7 +34,8 @@
     "build": "tsc -p ."
   },
   "dependencies": {
-    "puppeteer": "^12.0.1"
+    "puppeteer": "^12.0.1",
+    "rxjs": "^7.5.2"
   },
   "devDependencies": {
     "@babel/core": "^7.16.5",

src/app/naver/elementParser.ts

@@ -114,4 +114,8 @@ export default class ElementParser {
     };
     return paymentHistory;
   }
+
+  async parseManualOTPInputElement() {
+    return await this.page.$("#otp");
+  }
 }

src/app/naver/index.ts

@@ -1,7 +1,7 @@
 import Module from "./module";
 import ModuleFactory from "./moduleFactory";
 import URLChanger from "./urlChanger";
-import PageInteractor from "./pageInteractor";
+import PageInteractor, { LoginEvent } from "./pageInteractor";
 import ElementParser from "./elementParser";
 import Service from "./service";
 
@@ -12,4 +12,5 @@ export {
   PageInteractor,
   ElementParser,
   Service,
+  LoginEvent,
 };

src/app/naver/moduleFactory.ts

@@ -3,9 +3,9 @@ import { Module, URLChanger, ElementParser, PageInteractor } from ".";
 
 export default class ModuleFactory {
   static create(page: puppeteer.Page): Module {
-    const pageInteractor = new PageInteractor(page);
     const urlChanger = new URLChanger(page);
     const elementParser = new ElementParser(page);
+    const pageInteractor = new PageInteractor(page, elementParser);
 
     return {
       urlChanger,