2020-07-10
< 오늘 할 일 >
1. 웹 플랫폼마다 다양한 방식으로 채팅 기능을 제공하고 있다.
개발하는 언어의 선택이나 로직이 달라지진 않을까?
=> 페이지 변경을 목표로 한다면 HTML접근 모델 DOM은 모두 동일하기 때문에,
JavaScript를 이용하여 수정가능하다.
2. 구글 확장 프로그램은 JavaScript로 작성된다는 이론만 알고 있다.
어떻게 만들고, 어떻게 적용하는지 알아야한다.
=> 구글 확장 프로그램을 만들어보자
3. 구글 페이지 번역은 확장프로그램이며, API로 구현되어 있다.
이러한 API는 어떻게 로드하여 사용되는 것일까?
=> 직접 API를 적용해보는 예제를 만들어 확인해보자.
< 페이지 소스 수정 방식 >
1. Client.js에 CodeInjection을 통해 필터링 API 호출
=> 호환성이 떨어져 하드코딩 해야한다는 단점
* 하드코딩: 데이터를 상수로 다 박아넣는 것
2. HTML에 test.js를 삽입하여 DOM을 수정하는 방식
=> 딜레이를 감안하여 정보 업데이트에 관해서만 진행하도록 설계해야함
* 2020-07-11
정보 정리에 있어서 착오가 있었다.
" 수정방식 1번과 2번 모두 CodeInjection을 통해서 HTML 정보를 수정하는 것이다.
즉, test.js를 통해서 Client.js에 코드를 삽입하는 것이다. " - 인규
< 구글 확장프로그램 등록해보기>
https://developer.chrome.com/extensions/getstarted
위는 구글에서 제공하는 확장 프로그램 튜토리얼이다.
간단한 필터링 기능을 제공하는 js 코드를 작성해보았다.
[사진첨부]
< API 적용해보기 >
구글 페이지 번역기의 translate API는 무료로 제공하고 있다.
이를 우리가 만들었던 웹채팅 서비스에 적용해보면서 페이지 소스가 수정되는 것을 확인하였다.
[사진첨부]
<참고자료>
이번 회의는 뇌피셜을 적용시킬 수 있는지 직접 구현해보면서 생각해보았다
그렇기 때문에 모두 구글링하였다
3줄 요약
1. 야무진 꿈이 현실에 부딪혀 다른 내용으로 변경되었다.
2. 궁극적 목표인 확장 프로그램을 만드는데 있어서 JSON 공부만 열심히하면 된다.
3. 결과물을 가지고 알고리즘 팀에게 설명해줄 능력이 되었다.
'SecurityFactorial > Chat Filtering (X)' 카테고리의 다른 글
구글 이미지 크롤링 (0) | 2020.07.17 |
---|---|
두번째 회의 (0) | 2020.07.11 |
웹채팅 서비스 만들기 (1) | 2020.07.06 |
채팅 프로그램 분석 1차 회의 (0) | 2020.07.05 |
네트워크 기초(TCP/IP) (0) | 2020.07.05 |