ONLYOFFICE DocsとStrapiの連携方法について

## ONLYOFFICEとStrapiの連携について

Strapiは、APIを構築するために使用されるオープンソースのコンテンツマネージャーシステムです。ONLYOFFICEでは、ONLYOFFICE DocsとStrapiを統合し、Strapiのメディアライブラリでオフィスドキュメントを編集するための公式コネクタを提供しています。ONLYOFFICE統合プラグインは、[npm](https://www.npmjs.com/package/onlyoffice-strapi)ライブラリまたは[GitHub](https://github.com/ONLYOFFICE/onlyoffice-strapi)ページから入手できます。コネクターはApache-2.0ライセンスで配布されています。

#### 主な機能

* テキスト文書、スプレッドシート、スライドの編集と表示
* リアルタイムでの共同編集：2つの共同編集モード（高速と厳格）、変更履歴モード、コメント、内蔵チャット
* **JWTのサポート**により、適切な権限を持つユーザーを除いて、誰もドキュメントにアクセスできないように、トラフィックが保護できる

#### サポートされるフォーマット

* 閲覧・編集用：docx, xlsx, pptx
* 閲覧のみ：doc, docx, docm, dot, dotx, dotm, odt, fodt, ott, rtf, txt, html, htm, mht, xml, pdf, djvu, fb2, epub, xps, xls, xlsx, xlsm, xlt, xltx, xltm, ods, fods, ots, csv, pps, ppsx, ppsm, ppt, pptx, pptm, pot, potx, potm, odp, fodp, otp

## ONLYOFFICE DocsとStrapiの接続について

#### 動作環境

* ONLYOFFICE Docs（ドキュメントサーバ）v6.1.0以上

Strapiとエンドクライアントの両方から解決可能で接続可能なONLYOFFICE Docsのインスタンス、Strapiに直接POSTできる必要があります。

:::note warn
ONLYOFFICE Docsのインストールについては、
[公式ドキュメントページ](https://helpcenter.onlyoffice.com/installation/docs-index.aspx)をご参照ください。
:::

* Strapi v4.0.0以降
* Strapi用ONLYOFFICEコネクタv1.0.3

#### Strapi用ONLYOFFICE連携プラグインのインストール

１．エディタでフレームを挿入し、api.jsを読み込めるようにするため、`strapi/config/middlewares.js`ファイルの`strapi::security`行を以下の構成に置き換えます。
```
{
  name: "strapi::security",
  config: {
    contentSecurityPolicy: {
      useDefaults: true,
      directives: {
        "script-src": ["'self'", "https:", "http:"],
        "frame-src": ["'self'", "https:", "http:"],
      },
    },
  }
},  
```
もしこのような設定がすでに存在するならば、ディレクティブを追加するだけです。

２．プラグインをあなたのStrapiプロジェクトにインストールします。
```
npm install onlyoffice-strapi --save
```
３．ONLYOFFICEプラグインを管理者UIに含めるために、Strapiを再構築して再起動します。以下の通り、実行してください。
```
# using yarn
yarn build
yarn develop      

# using npm
npm run build
npm run develop
```
これで、Strapi用ONLYOFFICE連携プラグインがインストールされ、設定できるようになりました。プラグインは左パネルのプラグインセクションから「ONLYOFFICE」という名前でアクセスできます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2655664/a06e707b-0668-89e9-dde0-f041e28fffbf.png)

#### StrapiのONLYOFFICE連携プラグインを設定する

StrapiにONLYOFFICE連携プラグインを設定するには：

* 左のパネルから**設定**セクションを開いてください。
* **グローバル設定**セクションで、**ONLYOFFICE**メニュー項目をクリックします。
* **ONLYOFFICE設定**ページで、**ドキュメントサーバーアドレス**、つまりインストールされたONLYOFFICE DocsのURLを入力します。

#### ONLYOFFICEとStrapiの連携でJWTを有効にする

JWTまたはJSON Web Tokenは、クライアントの認証を検証するために、HTTPリクエスト内でクライアントからサーバーに送信される文字列です。JWTはクライアントサイドにのみ保存されるため、当事者間の通信は保護され、デジタル署名されます。

トークンは、JWT（[JSON Web Tokens](https://jwt.io/)）標準を使用して生成されます。トークンはサーバーの鍵で署名されているので、クライアントはトークンが正当なものであることを確認することができます。

ONLYOFFICE Docsはトークンを検証します。ペイロードのデータは有効であるとみなされ、メインパラメータの対応するデータの代わりに使用されます。トークンが無効な場合、コマンドは実行されません。詳しくは、[APIセキュリティガイド](https://api.onlyoffice.com/editors/security)をご覧ください。

JWTでドキュメントを保護するには：

* 左側のパネルから、「設定」セクションを開いてください。
* 「グローバル設定」セクションで、「ONLYOFFICE」メニュー項目をクリックします。
* 「ONLYOFFICE設定」ページで、「ドキュメントサーバーJWTシークレットキー」フィールドにシークレットキーを入力します。詳細については、[こちら](https://api.onlyoffice.com/editors/signature/)をご覧ください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2655664/b131bb87-ccfb-54f4-77cb-b3b4e217ccf5.png)

これでONLYOFFICE連携プラグインの設定が完了しましたので、早速使ってみましょう。

## Strapi内でONLYOFFICE Docsの利用を開始する

StrapiからONLYOFFICE Docsのエディタでオフィス文書を編集し、その変更をStrapiに保存できるようにするには、ファイルをアップロードし、対応するアクセス権を設定します。

#### Strapiにファイルをアップロードする

１．左パネルの「プラグイン」セクションで、「メディアライブラリ」ページを開きます。
２．右上の「新しいアセットを追加」ボタンをクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2655664/be8b3d41-c370-132e-200f-2fae44efc38c.png)

３．「新しいアセットの追加」ウィンドウが表示されます。**パソコンからアップロードする**か、**URLからアップロードする**かを選択し、上部パネルの対応するタブをクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2655664/39155894-785c-03b4-9fc3-4a7a198dfb4f.png)

#### Strapiでのファイルの表示、編集、管理

Strapi Media Libraryに追加されたドキュメントを閲覧・編集・共著する方法です。

１．左パネルの「プラグイン」セクションで、Strapi内の「ONLYOFFICE」ファイルページを開いてください。
２．ONLYOFFICEエディタでファイルを開くには、ファイル名をクリックするか、右側の「ONLYOFFICEで編集する」ボタンをクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2655664/98b244e2-2e5e-8b84-6045-c790c8b2e02c.png)

エディタ内で必要な形式でファイルを保存する場合：

１．「ファイル」タブに移動します。
２．「名前をつけてダウンロード」オプションをクリックし、必要な形式を選択します。

ファイルをお気に入りとして登録するには、エディター上部のツールバーで「お気に入りとして登録」の星アイコンをクリックします。

ファイルリストに戻るには：

１．「ファイル」タブを開きます。
２．右側のメニューで「ファイルの場所を開く」をクリックします。

#### アクセス権

Strapiメディアライブラリに追加されたファイルのアクセス権を管理するには：

１．左パネルの「基本」セクションにある「設定」タブに移動します。
２．「管理パネル」セクションで、「役割」タブに移動します。
３．ロール名の右側にある「編集」アイコンをクリックして、ロールを編集します。

ユーザーにファイルの**編集**を許可するには、必要なユーザー・ロールに「*更新＋削除*」のアクセス権を設定します。

ファイルの*閲覧のみ*を許可するには、必要なユーザー・ロールに「メディア・ライブラリへのアクセス」アクセス権を設定します。

[ONLYOFFICE Docs](https://www.onlyoffice.com/ja/download-docs.aspx?from=helpcenter)を手に入れましょう！