LoginSignup
0
1

Hexabase TypeScript SDKを使ってファイルをアップロードする

Last updated at Posted at 2023-05-22

Hexabase(ヘキサベース)は企業においても安心して利用できるBaaS(Backend as a Service)を提供しています。多くのBaaSがそうであるように、主にフロントエンド開発者に利用してもらいたいと考えています。そこで現在、TypeScript SDKの開発が進められています。

この記事ではHexabase TypeScript SDKのインストールと、ファイルアップロードを行う方法を解説します。

インストール

インストールはnpmやyarnを使って行います。

# npmの場合
npm install @hexabase/hexabase-js

# yarnの場合
yarn add @hexabase/hexabase-js

インポート

インポートすると、 HexabaseClient というオブジェクトが取得できます。

import { HexabaseClient } from "@hexabase/hexabase-js";

初期化

HexabaseClientを初期化します。

const client = new HexabaseClient();

認証

Hexabaseでは業務利用を想定しているため、利用する際に認証情報が必須になります。最初はメールアドレスとパスワードで認証し、その後はトークンを使ってGraphQLにアクセスします。 client を使って処理します。

初回の認証は次のようになります。emailとパスワード、またはトークンが必須です。

await client.login({email, password, token});

後はこの client に対して処理を行います。

プロジェクトを取得する

データレポートはプロジェクトに紐付きます。そこで、まず利用するプロジェクトを取得します。

現在のワークスペースを取得する

ログインした時点でHexabaseClientのcurrentWorkspaceが現在のワークスペースオブジェクトになっています。

client.currentWorkspace

ワークスペースを切り替える場合には、 setWorkspace メソッドを使います。

client.setWorkspace(newWorkspaceId);

そのワークスペースに紐付いているプロジェクトを取得します。

const project = await client.currentWorkspace.projects(projectId);

データストアへのアクセス時に必要な情報について

データストアへアクセスする際には以下の情報が必要です。

  • データストアID datastoreId
  • (オプション) プロジェクトID projectId

さらにデータ取得を行う際の情報(ページ数、取得件数など) params が指定できます。以下がアクセス例です。

const project = client.currentWorkspace.project(projectId);
const datastore = project.datastore(datastoreId);
const items = await datastore.items();
const item = items[0];

ファイルを作成する

ファイルは item.file() を使って、FileObjectのインスタンスを取得します。そして、 namedata を指定します。

const file = item.file();
const blob = new Blob(['Hello world'], { type: 'text/plain' });
file
  .set('name', 'test_file.txt')
  .set('data', blob);

アイテムと紐付ける際には、 set メソッドを使います。この時、フィールドは管理画面で添付ファイル型として指定します。

image.png

await item
  .set('test_file', [file])
  .save();

添付ファイルは複数指定できます。単数ではないので注意してください。

ファイルを取得する

ファイルを取得する際には、 get メソッドを使います。FileObjectの配列が返ってきます。

const files = item.get('test_file') as FileObject[];

実データを取得する

実データを取得する際には download メソッドを使ってください。 Blob型でデータが取得できます。

const data = await files[0].download() as Blob;

取得した内容は data にもセットされています。初回は必ず download を実行してください。

const data = files[0].get('data') as Blob;

ファイルを追加する

既存のデータに添付ファイルを追加する場合には、 add メソッドを使ってください。

const file = item.file();
const blob = new Blob(['Hello world'], { type: 'text/plain' });
file
  .set('name', 'test_file.txt')
  .set('data', blob);
await item
	.add('test_file', blob)
  .save();

まとめ

ファイルアップロード、ダウンロード機能を使えば、データに紐付いたファイルを登録できます。画像やドキュメントなど自由にアップロードできますので、利用してください。

株式会社 Hexabaseー法人向けクラウドシステム『Hexabase』ー

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1