DeepL API Freeを使用して翻訳してみる

# はじめに
新年早々、Netflexに加入しまして、以前からネットとかで海外ドラマのフレンズが英語の勉強にいいという噂は耳にしていたので、今年は素直にやってみようと思った次第です。
フレンズは1話あたり22分でシーズン1〜10まであり、全部で236話あるそうです。1日1話ずつ観ても8ヶ月くらいかかります。
フレンズの脚本のスクリプトも見ることができます。ただし、日本語訳はついていません。

https://dramadeenglish.com/friends_script_list/

http://livesinabox.com/friends/scripts.shtml

# DeepL API
DeepLは、口語に近い文章に訳してくれるということで、フレンズを訳すのにちょうど良いかなと思って、ちょっとしたアプリケーションを作る上でDeepL APIを試してみたくなりました。

## 準備
### 1.開発者向けのアカウントを登録
DeepLAPIを使うためにDeepLProアカウントを作ります。
https://www.deepl.com/pro#developer

姓名メールアドレスやパスワード、住所などを入力し、登録します。
このサイトから「DeepL API Free」を選択して手順に沿って登録します。

※クレジットカードを入力する項目がありますが、Freeプランであれば課金はされません。
※DeepL API Freeだと50万文字/月が上限のようです。（執筆時点）

### 2.登録後のAPI認証キーをコピーしておく
登録完了後に認証キーが表示されるのでコピーしておきます。
「XXX~XXXX:fx」というキーです。
マイページ->プランでも見ることができます。

## Python
Google Colaboratoryで簡単に使用してみます。
`API KEYを入力`のところは、API認証キーに書き換えてください。

```python
import requests

# NOTE: put API KEY
API_KEY:str = 'API KEYを入力'
txt = 'This is a pen.'

params = {
            "auth_key": API_KEY,
            "text": txt,
            "source_lang": 'EN',
            "target_lang": 'JA'
          }

request = requests.post("https://api-free.deepl.com/v2/translate", data=params)
result = request.json()
print(result["translations"][0]["text"])
```

### 結果
これはペンです。

## JavaScript
`API KEYを入力`のところは、API認証キーに書き換えてください。

```html
<!DOCTYPE html>
<html lang = "ja">
<head>
<meta charset = "utf-8">
<title>JavaScript</title>
<style>
  textarea {
    width: 500px;
    height:250px;
  }
</style>
</head>
<body>
<script>
const API_KEY = 'API KEYを入力';
const API_URL = 'https://api-free.deepl.com/v2/translate';

function output() {
  const entext = document.getElementById("entext").value;

  let content = encodeURI('auth_key=' + API_KEY + '&text=' + entext + '&source_lang=EN&target_lang=JA');
  let url = API_URL + '?' + content;

  fetch(url)
    .then(function(response) {
        if (response.ok) {
            return response.json();
        } else {
            throw new Error("Could not reach the API: " + response.statusText);
        }
    }).then(function(data) {
        document.getElementById("jatext").value = data["translations"][0]["text"];
    }).catch(function(error) {
        document.getElementById("jatext").value = error.message;
    });
};
</script>
<textarea id="entext" placeholder="英語を入力してください"></textarea>
<br>
<input type="button" value="翻  訳" onclick="output()" />
<br>
<textarea id="jatext"></textarea>
</body>
</html>
```

### 結果
試しにフレンズの一部を翻訳してみました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/14053/535dbdf2-0b8e-dd88-d987-814248610767.png)

```text:English
C’mon Daddy, listen to me! It’s like, it’s like, all of my life, everyone has always told me, ‘You’re a shoe! You’re a shoe, you’re a shoe, you’re a shoe!’. And today I just stopped and I said, ‘What if I don’t wanna be a shoe? What if I wanna be a- a purse, y’know? Or a- or a hat! No, I’m not saying I want you to buy me a hat, I’m saying I am a ha- It’s a metaphor, Daddy!
```

```text:Japanese
パパ、聞いてよ！これまでの人生で、誰もが私に言ってきたのは、『お前は靴だ！』ということでした。あなたは靴だ！あなたは靴だ！あなたは靴だ！』ってね。そして今日、私はただ立ち止まり、こう言ったのです「もし私が靴になりたくないとしたら？もし私が靴になりたくなかったら、どうしよう？あるいは......あるいは帽子！』と。帽子を買って欲しいと言っているのではなくて、私は帽子だと言っているの......それは比喩よ、パパ！」
```

### 注意点
まとめて翻訳させようとすると、翻訳できなかったりします。
また、話者のところが「モニカです。」みたいになるので、本文のみを訳させるようにした方がいい。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/14053/0a8e4409-423c-f944-f632-38ad74cea455.png)

### 嵌った点
最初、Python同様にPOSTでやろうとしたのですが、403エラー(type:cors)となり解決できず、諦めました。
サーバー側(node.js)ならPOSTできると思われますが、クライアント側はダメなのかな感じました。

https://qiita.com/Kohei-Sato-1221/items/0c64ebb9b3d3c38ff37b

## Google App Script(GAS)
`API KEYを入力`のところは、API認証キーに書き換えてください。
セルに例として、`=DeepL(A2)`とします。

```javascript
function DeepL(text, ) {
  const API_KEY = 'API KEYを入力';
  const API_URL = 'https://api-free.deepl.com/v2/translate';

  let content = encodeURI('auth_key=' + API_KEY + '&text=' + entext + '&source_lang=EN&target_lang=JA');
  let url = API_URL + '?' + content;

  let response = UrlFetchApp.fetch(url);
  let json = response.getContentText();
  let data = JSON.parse(json);

  return data["translations"][0]["text"];
}
```

### 結果
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/14053/fcefef3e-6fe9-bc24-7af2-bf347eaf74b9.png)

### 注意点
Google App Scriptの仕様で、スプレッドシートを読み込むたびに関数が実行されてしまうようなので、同じファイル内で大量に関数を使用すると月額上限に引っかかりやすくなるので注意しましょう。

### 参照
* [DeeplをGoogleスプレッドシートと統合しますか？](https://qapicks.com/question/149026-5efbb9a57be5])
* [GoogleスプレッドシートでDeepL翻訳関数を作る](https://qiita.com/chinotippy/items/d041627493cefb2f361d)

# 最後に
フレンズのスクリプトを訳す専用のツールを作ろうと思ってます。

あと、Chrome拡張の「Language Reactor」を使うとフレンズを英語字幕・日本語字幕を同時表示して視聴できるので便利です。

https://yaju3d.hatenablog.jp/entry/2022/01/13/235714