GAS 시작: 문서를 폴더에 넣고 PDF로 변환

16018 단어 CSSHTMLGASGoogle Apps Scripttech

만든 물건


이번에는 GAS를 사용하여 문서를 폴더에 넣고 버튼을 눌러 PDF로 변환하는 작은 웹 애플리케이션을 만들었다.
※ 또한, 이 프로젝트에서는 기본적인 자바스크립트 지식을 습득해야 합니다.

개시하다

  • Google Drive를 통해 새로운 AppScript Project를 제작합니다.
  • 기본적으로 하나의 파일Code.gs이 있습니다..gs는 Gscript·Google AppScript의 약자로, 이 파일에는 myFunction라는 함수가 있어야 한다.
  • GAS에서 웹 응용 프로그램을 만들기 위해서는 사용자에게 표시되는 인터페이스를 만들어야 한다.따라서 새 파일을 만듭니다index.html.
    • 이렇게 되면 개발 환경이 완비된다🎉
  • 그러나 개발을 시작하기 전에 다음과 같은 내용을 Code.gs 파일에 입력해야 한다.
    • function doGet(){return HtmlService.createHtmlOutputFromFile("index")}
  • 이게 뭐하는 짓인지 정확히 알 필요 없어.GAS 지시로 HTML 파일 찾기 index 를 알면 문제없습니다.
    • ⬇️ 그럼 관심 있는 부분을 알아봅시다.

    폴더에서 문서 추출

    myFunction（） 함수에서 사용할 세 개의 다른 폴더를 저장하는 데 사용할 폴더 ID 변수를 만들 수 있습니다.

    폴더 역할

  • 첫 번째 폴더는 기본적으로 문서를 저장하는 위치입니다.folderId
  • 두 번째 폴더는 새 PDF를 만드는 위치입니다.moveTofolderId
  • 마지막 폴더는 PDF로 변환된 문서를 저장할 수 있는 위치입니다. 따라서 다음 문서 그룹으로 이동할 때 중복을 방지할 수 있습니다.doneFolderId
    • function doGet(){
	var folderId = " ";
	var moveToFolderId = " ";
	var doneFolderId = " ";
}
    이 대상의 경로는 DriveApp인데 이 방법을 이용하여 수신 폴더 ID를 매개 변수getFolderById（）로 하고 ID를 통해 폴더에 접근할 수 있다.
    모든 문서folderId를 포함하는 폴더가 존재하기 때문에 getFiles（） 방법으로 폴더의 모든 파일을 가져올 수 있습니다.
    function myFunction() {
	var folderId = " ";
	var moveToFolderId = " ";
	var doneFolderId = " ";
	var allFiles = DriveApp.getFolderById(folderId).getFiles();
	var getMoveToFolder = DriveApp.getFolderById(moveToFolderId);
	var getDoneFolder = DriveApp.getFolderById(doneFolderId);
}

    폴더의 파일로 순환

  • 특정 폴더 내의 모든 파일에 접근할 수 있는 변수가 있기 때문에 while（） 순환으로 각 파일을 반복 처리할 수 있다.
  • while 순환은 이런 상황에서 파일 자체에 다른 파일이 있는지, 즉hasNext（） 방법의 조건을 취한다.이렇게 하면 폴더에 아무것도 남지 않을 때까지 순환이 계속됩니다.변수doc를 할당하여 문서를 개별적으로 저장할 수도 있습니다.
  • 따라서 moveTo（） 방법으로 문서를 특정 폴더로 이동할 수 있다.
    • while(filesN.hasNext()){
	var doc = filesN.next();
	doc.moveTo(doneFolder);
	var docName = doc.getName();
}
  • getName（）도 파일 이름을 변수 이름docName에 저장하는 방법을 사용할 수 있다.
    • 이렇게 하면 폴더가 그 중의 모든 파일에 접근하는 것을 순환할 수 있다🔁

    각 파일을 PDF화합니다.

  • 개별 문서에 액세스할 수 있으므로 getAs（） Google 문서 파일을 원하는 대로 저장할 수 있습니다.이 경우 PDF로 저장되므로 매개변수에 'application.pdf'를 입력합니다.
  • 또한 setName（） 방법을 이용하여 파일 이름을 ドキュメント名.pdf로 설정할 수 있다.
    • docBlob = doc.getAs('application/pdf');
docBlob.setName(docName + ".pdf");
var file = downloadedFolder.createFile(docBlob);
Logger.log(file.getUrl());
  • 이후 제작된 파일을 매개 변수로 가져오는 createFile（） 방법을 사용하여 특정 폴더에서 새 PDF 파일을 만들 수 있습니다.
    ※ 필요에 따라getUrl（） 사용법으로 작성된 파일의 위치Logger.log(자바스크립트로console.log（）도 수행할 수 있습니다.

    • UI 만들기

  • HTML 및 CSS를 사용하여 간단한 UI를 구성할 수 있습니다.Code.gs 에서 함수를 실행하는 함수 myFunction（） 를 만들기 위해 단추의 onclick 이벤트를 설정합니다.
    • <html>
  <head>
    <base target="_top">
  </head>
  <script>
    function startConversion(){
      google.script.run.myFunction();
    }
  </script>
  <body>
    <button onclick="startConversion();">Convert Doc to PDF</button>
  </body>
</html>
  • 위 상태에서도 역할을 할 수 있지만 추가withSuccessHandler（） 방법을 통해 조금이나마 공을 들일 수 있다.withSuccessHandler（） 방법은 Code.gs가 정상적으로 실행ｍｙFunction된 후에 매개 변수를 통해 새로운 다른 함수를 실행할 수 있는 함수이다.
  • 따라서 다음과 같은 것을 만들 수 있다
    • <!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <script>
    function startConversion(){
	  google.script.run.withSuccessHandler(createUpdate).myFunction();
    }
    function createUpdate(){
	  alert("Its Done!")
    }
  </script>
  <body>
    <button onclick="startConversion();">Convert Doc to PDF</button>
  </body>
</html>
    축하합니다!이렇게 하면 작업 절차가 자동화된다🥳
    물론 읽기 애니메이션을 DOM에 추가하는 등 alert（） 방법보다 창의적일 수도 있다.자신의 GitHub Gist에서 더 좋은 버전과 완전한 코드를 볼 수 있다.
    웹 앱에서 멋진 진행률 표시줄을 쉽게 만드는 방법은 무엇입니까?
    C#을 더 잘 작성하기 위한 5가지 쉬운 팁

    좋은 웹페이지 즐겨찾기

    개발자 우수 사이트 수집

    개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
    best100-homepage