구글 API로 Contact Us 폼 처리하기

form-submission-handler.js

0.00MB

jquery-3.2.1.min.js

0.08MB

// 구글 앱스 메일 설정하기

 

1. 자신의 구글 계정으로 로그인한 후 아래 사이트에 접속하여 [사본 만들기] 버튼을 클릭해 사본을 만들어 놓습니다.

docs.google.com/spreadsheets/u/1/d/1Bn4m6iA_Xch1zzhNvo_6CoQWqOAgwwkOWJKC-phHx2Q/copy

Google 스프레드시트 - 스프레드시트를 작성하고 수정할 수 있으며 무료입니다.

 

2. 샘플 엑셀 시트 상단 메뉴에서 [도구 > 스크립트 편집기]를 선택합니다.

 

3. 아래와 같은 스크립트 파일이 나오면 주석 기호(//)를 삭제하고 박스로 표시된 부분에 본인의 구글 메일 주소를 입력합니다.

 

4. [파일 > 버전관리]를 선택하여 텍스트 입력창에 사용할 스크립트의 제목을 작성한 후 [새 버전 저장] 버튼을 클릭합니다.

5. 메일 주소와 버전을 확인한 후 [확인]을 클릭합니다.

 

6. [게시 > 웹 앱으로 배포]를 선택하면 팝업창이 나타납니다. 팝업에 나오는 내용을 확인하고 [업데이트] 버튼을 클릭합니다.

 

7. [인증이 필요하다] 팝업의 [권한 검토]를 클릭합니다. 자신의 이메일 계정을 선택하면 아직 확인되지 않은 앱이라는 문구가 나옵니다. [고급 > 안전하지 않음]으로 이동하여 [허용]을 클릭합니다.

 

8. 현재 웹 앱 URL을 복사한 후 [확인]을 클릭합니다.

 

---

// HTML 파일 설정 및 전송 결과 확인하기

 

1. <form> 태그의 action 속성값에 복사한 URL을 지정합니다.

폼의 내용을 입력하면 링크로 이동되어 폼을 처리합니다.

See the Pen google API by miae (@flato) on CodePen.