컴퓨터의 Chrome 브라우저에 설치하는 확장 프로그램은 미리 정의된 활동을 수행하는 소스 코드 파일 그룹에 불과합니다. 일부 호기심 많은 사람들은 이러한 확장을 빌드하는 정확한 코드를 보고 싶어할 수 있습니다. Chrome에서 웹페이지의 소스 코드를 보는 것은 페이지를 마우스 오른쪽 버튼으로 클릭하고 옵션을 선택하는 것만큼 쉽지만 Chrome 확장 프로그램의 소스 코드에 액세스하는 것은 그리 쉽지 않습니다.
그러나 그렇다고 해서 확장의 소스 코드를 볼 수 있는 것은 아닙니다. 다음 두 가지 방법을 사용하여 컴퓨터에서 Chrome 확장 프로그램의 소스 코드를 볼 수 있어야 합니다.
다음 방법은 Mac을 사용하여 시연됩니다.
파일 탐색기에서 Chrome 확장 프로그램의 소스 코드 보기
Chrome에 설치한 확장 프로그램의 파일은 컴퓨터에 저장되지만 폴더 이름이 과학적이기 때문에 찾기가 쉽지 않습니다. 그러나 아래 방법을 사용하면 확장 소스 파일이 있는 폴더를 표시할 수 있어야 합니다.
1. 컴퓨터에서 Chrome을 열고 chrome://extensions를 입력합니다. 주소 표시줄에 입력하고 Enter 키를 누릅니다. 브라우저에서 확장 프로그램 목록이 열립니다.
2. 확장 페이지가 열리면 오른쪽 상단 모서리에서 "개발자 모드"라고 표시된 상자를 선택하십시오. 페이지의 확장 프로그램에 대한 자세한 내용을 볼 수 있어야 합니다.
3. 이제 화면에 표시된 확장 프로그램의 ID를 볼 수 있습니다. 여기서 해야 할 일은 소스 코드 파일을 보고자 하는 확장 프로그램의 ID를 기록하는 것입니다.
다음 예에서는 "YouTube용 Adblock" 확장의 ID를 강조 표시했습니다. 다음 단계에서 이 확장의 소스 코드를 공개할 것입니다.
4. 이제 확장 프로그램의 ID가 있으므로 chrome://version을 입력합니다. 브라우저의 주소 표시줄에 입력하고 Enter 키를 누릅니다. 확장 파일이 있는 폴더를 찾는 데 도움이 됩니다.
5. Chrome 버전 페이지에서 "프로필 경로" 값을 강조 표시하고 클립보드에 복사합니다. 다음 스크린샷에 나와 있습니다.
6. Finder(또는 OS의 파일 관리자)를 엽니다. 상단의 "이동"을 클릭하고 "폴더로 이동..."을 선택하면 Mac의 확장 폴더에 액세스할 수 있습니다.
7. 클립보드에 복사한 프로필 경로를 폴더로 이동 패널에 붙여넣고 "이동"을 클릭하여 Finder 창에서 해당 폴더를 엽니다.
8. 다음 화면에서 "Extensions" 폴더를 두 번 클릭하여 모든 확장 프로그램을 사용할 수 있는 폴더를 엽니다.
여기에서 볼 수 있는 것은 이름이 혼란스러운 여러 폴더입니다. 이 폴더들은 크롬에 설치한 확장 프로그램을 위한 것이지만 확장 프로그램 이름과 이름이 같지 않아 확장 프로그램의 폴더를 찾기가 어렵습니다.
이제 위의 단계 중 하나에서 기록해 둔 확장 ID와 이름이 같은 폴더를 찾습니다. 확장 프로그램의 폴더입니다.
9. 모든 확장 파일은 폴더에 있어야 하며 즐겨 사용하는 편집기로 파일을 열어 코드를 볼 수 있습니다.
타사 도구를 사용하지 않고도 Chrome 확장 프로그램의 소스 코드를 볼 수 있는 방법이었습니다. 확장 프로그램을 설치해도 괜찮다면 다음 섹션이 적합합니다.
확장 프로그램을 사용하여 Chrome 확장 프로그램의 소스 코드 보기
1. 컴퓨터에서 Chrome을 열고 Chrome 웹 스토어의 Chrome 확장 프로그램 소스 뷰어 페이지로 이동하여 "Chrome에 추가"를 클릭합니다.
2. 다음 화면에서 "확장 프로그램 추가"를 클릭합니다.
3. 브라우저에 확장 프로그램을 추가한 후 Markdown Preview 확장 프로그램 페이지와 같은 확장 프로그램 페이지를 Chrome 웹 스토어에서 엽니다.
페이지가 로드되면 Chrome의 확장 표시줄에서 CRX 아이콘을 클릭하고 "소스 보기"를 선택합니다.
4. Chrome 창에서 선택한 확장 프로그램의 소스 코드를 볼 수 있어야 합니다.
결론
브라우저에 설치한 확장 프로그램의 소스 코드가 궁금하다면 위의 가이드에서 두 가지 쉬운 방법을 사용하면 도움이 될 것입니다.