【FileMaker】Google Translate API を使ってみる

今や仕事でもプライベートでも他言語を見かけることが多くなりましたが、ざっと読むときは原文のままでもいいけれど、ちゃんと読みたい時は日本語に翻訳して読みたい時があります。
今回は、FileMakerからcurlを使ってGoogle Translate APIを使って、ブラウザを立ち上げることなく翻訳をしていこうと思います。

# 実行環境
今回はcurlを使いますので、FileMaker 16以上で実装・実行してみてください。

# アカウント
Google Cloudから直接使ってもいいのですが、今回はコードスニペットが豊富な[Rakuten Rapid API](https://api.rakuten.co.jp/)の方から実行します。
アカウントは既にあることを前提にして話を進めますが、アカウントを作るのは無料ですし有料無料に関わらず半端ない数のAPIがありますので、作っておいて損はないですよ。

# Google Translate API登録
API検索で"Google Translate API"ページへ行き、「登録してテスト」で登録します。
![スクリーンショット 2021-12-11 13.31.32.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/17cdb20a-6f1f-ac1d-6807-69bb1390cd71.png)

料金は使用量によって違いますが、今回はテストなので、無料のBasicプランを選択しました。
![スクリーンショット 2021-12-11 13.31.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/7fbdad42-eeb5-81b5-42de-30f90b7f46d2.png)

Rakuten Rapid APIを選択した理由として、コードスニペットが豊富だと書きました。
たいてい、主要な言語のみしかサンプルがなかったりするのですが、本当にたくさんの言語のサンプルが用意されていて、テストができるので、とても重宝しています。
FileMakerから使うときは、curlを記述するので、コードスニペットの言語プルダウンでcurlを探します。
![スクリーンショット 2021-12-11 18.10.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/7b40d1be-16b5-7e40-ef5f-8028a5e556b5.png)
単純にcurlは出てきません。
Shellのところにカテゴライズしてあります。
ほんと、ここに辿り着くのにスクロールをざーーーーっとしないとShell>curlに辿り着きません。
でも、ありがたいです！
![スクリーンショット 2021-12-11 17.30.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/13d9be94-5ed5-a139-3bcb-ec617911aaf6.png)

こんな感じで、実行直前のコードが出てきます。
![スクリーンショット 2021-12-11 18.13.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/f8904f3a-623e-a56d-0087-83d4edc0644e.png)
試しにこのコードをコピーして、ターミナル(mac)やコマンドライン(windows)で実行してみてください。
しっかり機能します！

# FileMakerに実装
では、実装していきましょう。
今回もローコードで行きますよ。

# テーブル設計
curlを実行するためには特になくてもいいのですが、サンプル的に入力（source)と出力(target)を指定するのにフィールドを作ります。
![スクリーンショット 2021-12-11 13.35.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/50a92a72-12f9-5d01-23a7-2c33accd4df7.png)

# レイアウト設計
入力と出力フィールドを設置し、ボタンを配置します。
![スクリーンショット 2021-12-11 20.01.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/9c9b1b4f-e78c-eb24-7171-d65b1490ab71.png)
ボタンは、「日→英」「英→日」の翻訳ボタンになります。
スクリプトは、スクリプトを作ってから当てましょう。
![スクリーンショット 2021-12-11 20.01.59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/bdb392d8-19a3-0e4b-3255-857233805753.png)

#　スクリプト作成
スクリプトは、5行です。
変換するのに、「日→英」の場合はtargetの"en"を、「英→日」の場合はtargetの"ja"をスクリプトの引数に指定するように設計します。
![スクリーンショット 2021-12-11 20.05.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/0abfa63f-edbf-f771-8a2e-725026e36ae3.png)

## ポイントの解説
curlを指定する、「[URL から挿入](https://help.claris.com/ja/pro-help/content/insert-from-url.html)」の書き方がポイントです。

### ヘッダーの構築
curlの構文はをみていきましょう。

```
curl --request POST \
	--url https://google-translate1.p.rapidapi.com/language/translate/v2 \
	--header 'accept-encoding: application/gzip' \
	--header 'content-type: application/x-www-form-urlencoded' \
	--header 'x-rapidapi-host: google-translate1.p.rapidapi.com' \
	--header 'x-rapidapi-key: <RAPID_API_KEY>' \
	--data 'q=Hello, world!' \
	--data target=es \
	--data source=en
```

このうち、ヘッダーの指定として、"--header"以外に、最初の行にある"--request POST"もcurlオプションとして指定します。
![スクリーンショット 2021-12-11 20.07.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/a9ce3030-324c-bc69-3f40-b572a9d60600.png)
curl構文と比べてわかると思いますが、シングルクォーテーションの部分は、ダブルクォーテーションにして、バックスラッシュを前に付加します。
覚えてしまえばすぐに脳内変換できますが、慣れていないとつまづくポイントだと思います。


### 翻訳する文章を送るのに組み立てる部分
サンプルだと、

```
	--data 'q=Hello, world!' \
	--data target=es \
	--data source=en
```

と、なり、実際ターミナルで単純にcurlを叩くとそのまま送信され、正常に終了できます。
FileMakerで書くときは、次のようになります。

```
" --data \"q=Hello, world!\"" &
" --data target=es" &
" --data source=en"
```
そして、「URL から挿入」のcurlオプションとしてデータを指定する際、ここはなぜかJSONではなく、"--data"でそれぞれ指定します。
いつもの感覚で、JSONを組み立ててしまうと、構文が違うとエラーが返ってきますので、お間違えなく。
今回のFileMakerに組み込むときは、テーブル設計で作成したsourceDataを指定します。
targetとsourceの言語は、引数に指定されたtargetから判断するように、case文で構築します。
![スクリーンショット 2021-12-11 20.05.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/74d12ea2-2bc3-309e-bc28-ededdec7d649.png)

スクリプトもできたことなので、先程のレイアウトのボタンに貼り付けましょう。
![スクリーンショット 2021-12-11 20.39.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/bc5c6670-fed7-d90c-90de-dda876468afd.png)


実装は、以上です！

# 実行してみる
では、やってみましょう。

## 日→英
![スクリーンショット 2021-12-11 20.39.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/8a25317f-6ae7-f3bb-c096-db2751a93845.png)

## 英→日
![スクリーンショット 2021-12-11 20.40.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/60538/bba0d461-5a90-5629-f556-88a101ff5994.png)


若干、変換できない部分がcharコードで返ってきている部分もありますが、十分ではないでしょうか！？
翻訳する文章量によっては、月間の無料枠がすぐに到達してしまうので実運用ではプロ以上の契約の方が安心して利用できるかもしれません。
この翻訳でいけそうだな、と思ったら、ぜひ有料プランも考えてみてください！