0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

NoCode & LowCodeAdvent Calendar 2023

Day 12

Xanoに外部サーバのCSVファイルをJSONにしてインポートする

Last updated at Posted at 2023-12-11

概要

外から見えるサーバに置かれたCSVファイルを、URLを指定してXanoにインポートします。
今回はBubbleサーバに置かれたファイルを使い、BubbleにCSVファイルがアップロードされたタイミングでインポートします。

Xanoとは

DBaaS(Database as a Service)の一つで、コーディングせずにDBやDB操作のAPIを作成できます。
ホームページは、https://www.xano.com/ です。

Xenoの設定

準備

  • 上記ホームページからアカウントを作成します。

    • 無料プランは、100,000レコードまでという制限があります。価格表をご覧ください。
  • ログインして、インスタンス、ワークスペースを作成します。

インポート先のテーブルを作成

  • 左メニューの「Database」を選択します。
  • 右上の「Add Table」より、インポート先のテーブルを作成します。今回は「members」というテーブルを作りました。
    • idカラム、created_atカラムは自動的に作成されます。このカラムは削除できません。
  • 必要なカラムを追加します。
    • 型はText, Integer, Object, Table Referenceなどが選択できます。
    • カラム名は英数字と半角記号のみ使用できます。日本語は使用できません。

インポート用APIを作成

  • 左メニューの「API」を選択します。
  • API Groupを作成します。
  • 右上の「Add API Endpoint」から、APIを作成します。
    • typeは「Start from scratch」
    • Name、Verb(GET、POSTなどから1つを選択)を指定します。今回はPOSTでURLを投げる方式にします。
  • APIの中身を作成します。
    • 1.Input
      • Text型で、「csvurl」というパラメタ名にします。必須にしたいので、Requiredを「yes」にします。
    • 2.Function Stack
      • 「External API Request」(API Request To)で、指定されたURLからCSVデータを取得します。
        • urlには、1.Inputで指定した「csvurl」を指定します。
        • Outputは、デフォルトのまま「api_1」とします。
      • 「Database Requests」ー「Database Transaction」で、以下の2つをトランザクションでくくって、両方成功、または両方失敗になるようにします。
      • 「Add function」で、トランザクションに入れる2つの処理を指定します。
        • 「Database Requests」ー「Clear All Records」で、membersテーブルを空にします。IDを1から振り直す場合は、reset=trueを指定します。
        • 「Database Requests」ー「Add Multiple Records in Bulk」(Add Bulk Records)で、 membersテーブルに一括登録します。
          • 「items」に、api_1.response.result」と指定します。
          • 「Return variable」は、デフォルトのまま「members_2」とします。
    • 3.Response
      • RETURNに「var:members_2」を選択します。他はデフォルトのまま「AS Self」とします。

Bubbleの設定

画面

  • File Uploaderを設置し、CSVファイルをBubbleのサーバにアップロードできるようにします。

Workflow

  • 必要に応じて、上記でアップロードしたCSVファイルのカラム名やカラムの並び順を変更し、JSONで保存ます。

    • CSV chop and encodeというBubbleプラグインを作りました。
      • CSVファイルがアップロードされた際に、指定したカラムだけ取り出し、カラム名や順序や文字コードを変更し、100行ごと(変更可)に区切ってJSONファイルに出力します
  • 上記で作成したXanoのAPIにそのJSONファイルのURLを渡します。

    • API Connectorで、上記のJSONファイルのURLを上記のAPIにPOSTで渡します。

動作確認

  • Bubbleからファイルをアップロードして、Xanoのテーブルが書き換わることを確認します。

注意

  • 上記のままでは、URLが分かれば誰でもCSVファイルをアップロードできてしまします。Bubble、XanoのAPIともに、認証機能を付けたり、APIキーを使ったり、IPアドレスを判断するなど、セキュリティ対策をとってください。
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

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?