크롬/웨일 확장프로그램 출시하기

버들비·2020년 10월 24일

0.

웨일 익스텐션 스토어 둘러보다가 아래와 같은 좋은 익스텐션을 발견해서, 원작자의 허락을 받고 연세대 버전으로 제작하기로 했다.

https://store.whale.naver.com/detail/lniagbhflokdpfoilcmcpdmaphllolai

1. 프로젝트 구성

크롬 익스텐션의 파일구조는 일반 웹페이지와 비슷하다. 사용자에게 보여지는 html, 문서를 꾸미는 css, 문서를 제어하는 js 파일로 이루어진다.

거기에 더해 크롬 익스텐션 출시를 위한 설정파일(manifest.json)이 더해진다.

manifest.json

{
  "manifest_version": 2,
  "name": "고연세 Go Yonsei",
  "version": "0.1.1",
  "description": "연대생들을 위한 사이트 모음",
  "icons": {
    "16": "./assets/logo.png",
    "48": "./assets/logo.png",
    "128": "./assets/logo.png"
  },
  "browser_action": {
    "default_popup": "./popup/index.html",
    "default_icon": {
      "16": "./assets/logo.png"
    }
  },
  "permissions": [
  ]
}

manifest_version, name, description, icons 항목외에 browser_action 이나 permissions 부분은 익스텐션 기능에 따라 천차 만별일듯 하다.

2. 익스텐션 스토어 출시 신청하기

준비물: 5$, 128x128 로고, 1280x800 프리뷰 사진

크롬, 웨일, 파이어폭스 중 크롬만 익스텐션을 올리려면 5 $를 지불하고 개발자 등록을 해야한다. 크롬 익스텐션 스토어에 로그인 하고 해외결제가 가능한 카드로 5$ 결제하면 바로 등록이 된다.

개발자 등록을 한 뒤, 우측상단 설정아이콘을 눌러 개발자 대시보드로 들어간다.

그러면 시국이 시국답게 covid로 검수가 느려지고 있다 어쩌구 공지가 쭉 뜬다. 무시하고 오른쪽 아래 +새 항목을 클릭한다.

그러면 zip 파일을 업로드 하라고 뜨는데, 1번 항목에 나와있는 chrome 폴더를 압축해서 업로드 하면 된다.
단, 파이어폭스의 경우 root 에 manifest.json 가 없다고 오류를 뱉으니 디렉토리 안에서 구성파일들만 압축해서 올리면 된다.

zip 파일을 압축하면 스토어 등록정보를 입력해야 한다.

스토어 아이콘과 프리뷰용 캡쳐화면도 추가한다.
웨일과 파이어폭스는 적당히 올려도 알아서 리사이징 해주는데, 크롬은 정확히 128x128 아이콘과 1280x800 프리뷰 사진을 요구한다.

추가 입력란은 홈페이지나 지원 url 을 넣으면 된다. 넣고 싶으면 넣고 안넣어도 출시엔 별 영향 안주는듯.

크롬의 경우, 스토어 등록정보 입력이 끝나면 개인정보 보호 탭을 입력해야한다.
manifest.json 파일내 permission 항목에 추가한 내용이 있다면 입력할게 늘어난다.
예를들어 "tabs" 항목을 permission 에 집어넣었다면, 왜 이 권한을 요구했는지 서술해야한다.
(앱 동작에 필요하지 않은 권한을 요구하는 익스텐션은 심사를 반려당할 수 있다. 이런 권한은 필요없으니 permissions 에서 삭제한 후 다시 업로드 해달라고 메일로 알려준다)

원격코드 사용 항목의 경우, cdn 이나 외부 파일 참조를 안하는 익스텐션이라서 아니요를 골라줬다. 예를 눌렀다면 또 왜 그런 권한을 쓰는지에 대해 설명해야한다.

웨일이나 파이어폭스는 권한 요청에 대해 설명할 필요가 없다.

패키지를 업로드 하고, 스토어 등록정보를 입력하고, 개인정보 보호를 입력하고, 가격 및 배포 국가를 설정하면 작성 끝.