1. 크롤링 방식 의사 결정 트리 (1) 메인 HTML 소스에 찾는 데이터가 존재 - 크롤링 방식을 다시 결정하기 위해 사이트 > "페이지 소스 보기"를 통해 크롤링하고자 하는 페이지의 최초 HTML 소스를 확인했다 - 동적 페이지이므로 메인 HTML 소스 안에 찾고자 하는 데이터가 존재하지 않는다 :) ..! * 앞선 포스트에서 사용했던 방법은 1번 axios + cheerio를 사용한 방법 (2) 추가적인 API 호출에 데이터가 존재 - API에 추출하고자 하는 데이터가 존재하는지 확인하기 위해 - 해당 페이지에서 개발자 옵션의 Network를 열고 새로고침했다 - 상당히 많은 양의 API가 호출되는데 그 중 추출하고자하는 값을 Response로 가져오는 API와 경로를 찾았다 - https://sw..
0. 패키지 설치 - 크롤링에 사용할 axios, cheerio, iconv-lite 라이브러리 설치 - iconv-lite : 유니코드 문자열이 깨지지 않도록 하는 라이브러리 - puppeteer : 헤드리스 브라우저를 프로그래밍 방식으로 조작하는 라이브러리 - loadsh : 자바스크립트에 기본으로 제공되지 않는 유틸리티 함수를 제공하는 라이브러리 npm i axios cheerio iconv-lite npm i puppeteer@9.1.1 lodash@4.17.20 date-fns@2.21.1 date-fns-tz@1.1.4 1. Cheerio와 axios를 사용한 크롤링 const axios = require('axios'); const iconv = require('iconv-lite'); //..
1. popup.html - getUrl 버튼을 누르면 URL을 불러오도록 동작 - result 자리에 불러온 URL이 담기도록할 것 ex getURL 2. manifest.json 1) permissions에 유의하기 - 참고한 레퍼에서는 permissions에 사용하여 모든 URL을 참조할 수 있도록 함 - Permissions is unknown or URL pattern is malformed 오류 발생 - Manifest version3에서는 사용할 수 없는 방법이라고 함 - host_permissions을 추가하여 오류 해결 { "manifest_version": 3, "name": "Chrome Extension", "version": "0.1.0", "description": "Bringk..
1. cmd에서 Chrome Extension CLI 설치하기 npm install -g chromex-cli 2. "chrome-extension" 프로젝트 명 지정하여 새로운 프로젝트 생성 chromex create my-extension 2. cheerio도 사용할 것이니 설치 npm install cheerio 3. 확장 프로그램 실행을 위해 생성된 디렉토리로 이동하여 명령어 실행 cd my-extension npm run watch 4. chrome://extensions에 접속하여 개발자 모드를 On하고 압축 해제된 확장 프로그램 로드 5. chrome-extionsion/build 폴더 선택 6. 확장 프로그램이 추가된 것 확인
