아무나 할 수 있어!이미지로 AI를 인식하는 LINE BOT의 제작 방법

画像認識AIを使ったLINE BOT
안녕하세요, 저는 2z입니다.
며칠 전 AI 메이커 API가 공개됐는데, 이번에는 API를 활용해 라인 봇을 만들었습니다!
■ 이제 눈에 띄는 AI 애플리케이션을 간단히 만들 수 있는'AI 메이커'API를 공개합니다!
https://qiita.com/2zn01/items/c324c7f4d42e0b335bed
혼자 해도 재미없으니까 아무나 할 수 있는 튜토리얼을 API로 만들고 싶어요.

만든 물건


단지 하나의 예일 뿐이지만 다음 라인 봇은 만들어 보았습니다.
"색마 진단"
  • LINE에 이미지를 올리면 업로드된 이미지에 따라 어떤 색마인지 판정한다.
  • 시스템 개요

  • LINE Messaging API
  • Google Apps Script
  • AI 제조업체 API
  • システム概要図
    다음 절차에 따라 처리하다.
  • 이미지가 LINE에 업로드될 때 웹 훅을 통해 Google Apps Script를 호출하는 프로그램
  • Messageing API를 통해 이미지를 가져와 AI 제조업체에 보내는 API
  • AI 공급업체의 API로부터 진단 결과를 받아 Messageing API를 통해 결과를 반환
  • 방법


    1. AI 메이커가 이미지 인식 AI 만들기


    우선 라인 봇이 이미지 진단을 하게 하려는 소재를 고려해 AI 제조사로 이미지 인식 AI를 만들어 보세요.
    (트위터 계정 필요)
    ■ AI 제조사
    https://aimaker.io/
    생성되면 생성된 모델의 ID와 API 키를 기록합니다.
    색마 진단의 경우 "API 사용!"칸에서 확인하세요.
    https://aimaker.io/app/image-classification/id/2438
    또 AI를 만들지 않더라도 다른 사람이 이미 만든 AI를 사용할 수 있다.
    다음 여러분의 AI에서 찾아보세요.
    https://aimaker.io/app/search/

    2. Google Apps Script 설정


    LINE 및 AI 공급업체의 브로커로서 Google Apps Script를 설정합니다.
    1. 다음 URL에서 Google 드라이브를 엽니다.
    (Google 계정이 없는 경우 생성)
    https://drive.google.com/
    2. 왼쪽 상단의'신설'단추를 통해 구글 작업표를 열어 주세요.
    3. 메뉴 모음의 도구 -> 스크립트 편집기를 선택합니다.
    이렇게 Google Apps Script 편집기가 열립니다.
    당분간 이 상태로 공개한다.
    4. 메뉴 표시줄의 공개 -> 웹 응용 프로그램으로 가져오기 를 선택합니다.
    프로젝트 이름을 입력하고 다음 설정에 공개합니다.
  • 다음 사용자로 응용 프로그램 실행: 나
  • 응용 프로그램에 접근할 수 있는 사용자: 모두(익명 사용자 포함)
  • 현재 웹 응용 프로그램의 URL에 표시된 URL을 복사하고 유지합니다.

    3. Google 문서 작성


    디버그 로그를 출력하는 Google 문서를 만듭니다.
    1. 다음 URL에서 Google 드라이브를 엽니다.
    https://drive.google.com/
    2. 왼쪽 상단의 [새로 만들기] 버튼을 사용하여 Google 문서를 엽니다.
    3. 만든 문서에 이름을 추가하고 저장합니다.
    "{문서 ID}"섹션을 Google 문서의 URL에 기록하십시오.
    https://docs.google.com/document/d/{문서 ID]/edit

    4. LINE Developer 설정


    · LINE Developer에 개발자 등록, 공급업체 등록


    우선 LINE Developer를 방문하세요!
    https://developers.line.me/ja/
    다음 공식 문서의 절차에 따라 1~3까지 등록하세요.
    https://developers.line.me/ja/docs/messaging-api/getting-started/

    • 채널 만들기

  • 생성된 공급업체에 액세스
  • "새 채널 만들기
  • "클릭
  • Messageing API
  • 선택
  • 다음 사항을 입력하여 채널을 만듭니다.
  • 선험 비디오 이미지
  • 애플리케이션 이름
  • 응용 설명
  • 계획(※ 선택의 자유)
  • 대업종, 소업종
  • 이메일 주소
  • 생성된 채널의 채널 기본 설정에서 다음을 설정합니다.
    • 정보 송수신 설정
  • 방문영패(장기): 발행(발행된 방문영패를 적어 주십시오)
  • Webhook 발송: "이용"으로 변경
  • Webhook URL: Google Apps Script로 설정된 레코드를 지정하는 URL
  • · LINE@ 기능 사용
  • 자동 응답 메시지: 사용하지 않음
  • 으로 변경
  • 친구 추가 시 인사: 임의의 정보를 설정하세요.
  • LINE 측 설정은 여기서 끝냅니다.

    5. Google Apps Script의 소스 코드


    소스 코드의 "$~$~"에서 이전 설명에 기록된 값으로 변경하여 사용하십시오.
    var AIMAKER_MODEL_ID = $AIメーカーで作成したモデルのIDを指定してください$;
    var AIMAKER_API_KEY = "$AIメーカーのAPIキーを指定してください$";
    var LINE_ACCESS_TOKEN = "$LINE Developerで発行されたアクセストークンを指定してください$";
    var GOOGLE_DOCS_ID = "$GoogleドキュメントのドキュメントIDを指定してください$";
    var doc = DocumentApp.openById(GOOGLE_DOCS_ID);
    
    function doPost(e){
      Logger.log("Post request.");
      try {
        var json = JSON.parse(e.postData.contents);
        var token= json.events[0].replyToken;
        var url = 'https://api-data.line.me/v2/bot/message/'+ json.events[0].message.id +'/content/';
        var image = getImage(url);
        var base64 = Utilities.base64Encode(image.getContent());
        var message = getResult(base64);
        if (message == '') {
          message = "識別できませんでした。";
        }
        sendLineMessage(message, token);
      } catch (e) {
        Logger.log("ERROR: %s", e)
        message = "処理に失敗しました。"
        sendLineMessage(message, token);
        doc.getBody().appendParagraph(Logger.getLog());
      }
      doc.getBody().appendParagraph(Logger.getLog());
    }
    
    function getImage(url){
      return UrlFetchApp.fetch(url, {
        'headers': {
          'Content-Type': 'application/json; charset=UTF-8',
          'Authorization': 'Bearer ' + LINE_ACCESS_TOKEN,
        },
        'method': 'GET'
      });
    }
    
    function getResult(base64){
      var result = '';
      var url = 'https://aimaker.io/image/classification/api';
      var payload = {
        "id": AIMAKER_MODEL_ID,
        "apikey": AIMAKER_API_KEY,
        "base64": base64
      };
      var response = UrlFetchApp.fetch(url, {   
        method: 'POST', 
        payload: payload, 
        muteHttpExceptions: true
      });
      response = response.getContentText();
      Logger.log(response); 
      var json = JSON.parse(response);
      var labels = sortLabel(json.labels);
      if (labels[0].label && labels[0].score){  
        result = 'この画像の診断結果は、「' + labels[0].label + ': ' + (Math.round(labels[0].score * 10000) / 100) + "%」です!\n\n";
      }
      for (var i in labels) {
        if (labels[i].label && labels[i].score) {
          result = result + labels[i].label + ': ' + (Math.round(labels[i].score * 10000) / 100) + "%\n";
        }
      }
      return result;
    }
    
    function sortLabel(labels){
      labels.sort(function(a,b){
        if (a.score > b.score) return -1;
        if (a.score < b.score) return 1;
        return 0;
      });
      return labels;
    }
    
    function sendLineMessage(message,token){
      var url = "https://api.line.me/v2/bot/message/reply";
      return UrlFetchApp.fetch(url, {
        'headers': { 
          'Content-Type': 'application/json; charset=UTF-8',
          'Authorization': 'Bearer ' + LINE_ACCESS_TOKEN,
        },
        'method': 'POST',
        'payload': JSON.stringify({ 
          'replyToken': token,
          'messages': [
            { 
              "type": "text",
              "text": message
            } 
          ], 
        })
      });
    }
    

    최후


    이미지를 사용하여 AI를 인식하는 LINE BOT을 만들려면 반드시 절차를 참조하십시오.
    도대체 템플릿일 뿐이라는 이 기사를 통해 이미지인식 AI의 소재를 바꾸고 진단 결과를 맞춤형으로 만들어 보는 등 그렇게 하면 더 재미있을 것 같다.
    AI 제조업체에 조금이라도 관심이 있다면 꼭 따라가세요. 리트윗으로 응원해 주세요!
  • Twitter:
  • note: @2zn01
  • • 문자 유발
    • 이미지 식별

    좋은 웹페이지 즐겨찾기