킨톤 첨부 파일을 URL로 표시

11656 단어 금과

소개



많은 해커슨 이벤트에서 금과 소리이 데이터베이스로 사용됩니다. kintone에는 다양한 데이터를 저장할 수 있지만, 그 중에서도 이미지 파일 등의 바이너리 데이터를 쉽게 저장할 수 있는 것이 강점입니다.



그런데 이 첨부 파일 필드에 저장된 이미지 데이터를 표시하려고 하면 갑자기 장애물이 올라갑니다. 왜냐하면 kintone에서는 첨부 파일을 외부에서 직접 표시하는 수단은 없고, 한 번 다운로드시켜야 하기 때문입니다.
첨부파일 URL 가져오기

그래서 본 기사에서는 첨부파일을 다운로드하지 않고 직접 URL 지정으로 표시할 수 있는 방법을 소개합니다.
특히 AWS Lambda와 API Gateway를 사용합니다. 그러므로, 이러한 지식이 있는 분을 타겟으로 하고 있습니다.
그리고 이번에는 Lambda 코드 만 소개하므로 미리 양해 바랍니다.

코드 소개



그럼 곧 Lambda (Node.js) 코드입니다.
const kintone = require('@kintone/kintone-js-sdk');
const fs = require("fs");

exports.handler = (event, context, callback) => {
    // パラメータを確認
    console.log(`event: ${event}`);
    const recordId = event.id || 1;

    // kintone認証設定(API KEY) 
    let kintoneAuth = new kintone.Auth();
    kintoneAuth.setApiToken({
        apiToken: process.env.KINTONE_API_TOKEN,
    });

    // コネクション作成
    const kintoneConnection = new kintone.Connection({
        domain: process.env.KINTONE_APP_URI,
        auth: kintoneAuth,
        guestSpaceID: process.env.KINTONE_GUEST_ID, // ゲストスペースID
    });

    // 添付ファイル
    const kintoneFile = new kintone.File({
        connection: kintoneConnection
    });

    // レコード作成
    const kintoneRecord = new kintone.Record({
        connection: kintoneConnection
    });

    // アプリID
    const appID = process.env.KINTONE_APP_ID; 

    kintoneRecord.getRecord({
        app: appID,
        id: recordId,
    })
    .then(async resp => {
        const face = resp.record.Face.value[0];  // 'Face'の部分が添付ファイルフィールドのフィールドコードになります
        console.log(`fileKey: ${face.fileKey}`);
        console.log(`contentType: ${face.contentType}`);
        console.log(`size: ${face.name}`);
        console.log(`size: ${face.size}`);
        const fileName = `/tmp/${face.name}`;
        await kintoneFile.download({
            fileKey: face.fileKey,
            outPutFilePath: fileName,
        });
        return fileName;
    })
    .then(fileName => {
        const picture = fs.readFileSync(fileName, "base64");
        callback(null, picture);
    })
    .catch((err) => {
        console.log(err);
        callback(err);
    });
};

kintone의 API Key와 앱 URL, 앱 ID 등은 모두 환경 변수로 설정하고 있으므로 Lambda를 실행할 때 자신의 환경에 맞게 설정하십시오.
또, 코드의 도중에 첨부 파일 필드의 필드 코드를 지정하고 있으므로, 여기도 자신의 환경에 맞추어 변경해 주세요.
표시하려는 레코드 ID는 Lambda 실행시 id라는 매개 변수로 전달됩니다. 방법은 아래의 기사 등이 참고가 될 것입니다.
Lambda에 API Gateway에서 값 전달

코드 포인트



kintone의 JavaScript SDK 사용



첨부파일의 취급은 상당히 귀찮습니다만, kintone의 JavaScript SDK를 사용하면 매우 간단하게 취급할 수 있습니다.
kintone JS SDK를 사용하여 첨부 파일 조작

다만, 이 SDK에도 함정이 있어, Node.js로부터 이용하는 경우는, 첨부 파일을 다운로드하는 경로 지정 가 필수가 됩니다. 그래, 결국 다운로드시켜야 합니다.

Lambda에서 /tmp 폴더 사용



이번에는 AWS Lambda를 사용하고 싶습니다. 아시다시피 Lambda는 런타임에 환경이 조달되는 메커니즘이므로 영구적으로 파일을 저장할 수 없습니다. 거기서 생각하는 것은 S3와 같은 스토리지의 이용입니다.
그러나 일부러 이미지를 표시하기 위해서만 S3를 사용하는 것도 어떨까 생각합니다 (이미 Lambda와 API Gateway 사용하는 사람에게 말하지 않았습니까 w).
그래서, 여러가지 조사했는데, 무려 Lambda로부터도/tmp 폴더에만 쓸 수가 있는 것 같습니다.
AWS Lambda에서 파일 입출력 시도
이번 사용법에서는, 파일은 일시적으로 보존할 수 있으면 좋기 때문에, 이 방법이 좋을 것 같습니다.

Base64 형식 사용



이번에 가장 빠진 것이 이미지 데이터를/tmp 폴더에 저장한 후 그것을 꺼내는 곳이었습니다.
결론부터 말하면 fs.readFileSync(fileName, "base64") 에서 꺼내면 괜찮습니다.
나는 여기를 binary 모드로 꺼내려고 하고 2일 빠졌습니다.

그래서 이 기사만으로는 구현하기 어려울지도 모릅니다만, 제일 빠지는 곳만을 소개했으므로, 후에는 여러분 열심히 해 주세요.
마지막으로 API Gateway를 통해 브라우저 표시한 실행 예를 올려 둡니다.

좋은 웹페이지 즐겨찾기