MTAppjQuery と Data API proxy を組み合わせて管理画面で Data API を快適に使う

MTAppjQuery と Data API proxy を組み合わせれば、管理画面と Data API に同時にログインしたような状態になり、管理画面で Data API を快適に使うことができます。

この記事は弊社 bit part 合同会社が提供している Movable Type プラグイン「MTAppjQuery」の利用を前提としております。MTAppjQuery って何?という方は弊社の「MTAppjQuery」の製品ページをご覧ください。

MTAppjQuery を使っていると「管理画面で Data API を使いたい」「しかもログイン認証が必要なエンドポイントを使いたい」という需要が多々あります。

そのような時は、M-Logic さんが公開している Data API proxy プラグインを一緒に使うことをおすすめします。

このプラグインを利用すると、Movable Type の管理画面にログインしていれば、そのログイン情報を利用して、Data API の認証が必要なエンドポイントを利用することができます。要するに、管理画面にログインしていれば Data API にも同時にログインしていることになるイメージです。

ここでは、MTAppjQuery と Data API proxy を組み合わせて利用する方法をご紹介します。

Data API proxy プラグインのインストール

Data API proxy から ZIP ファイルをダウンロードし、展開します。

mt-plugin-dataapi-proxy-master
├── LICENSE
├── README.md
└── plugins
 └── DataAPIProxy

展開したディレクトリの plugins の中にある DataAPIProxy をサーバー上の mt/plugins ディレクトリにアップロードします。インストールはこれだけで、プラグインの設定も特にありません。

「システムのプラグイン設定」に「DataAPIProxy」プラグインが表示されればインストール成功です。

dataapiproxy.cgi のパーミッションの変更

アップロードした DataAPIProxy ディレクトリの中に dataapiproxy.cgi というファイルがあります。

このファイルのパーミッションを 755 など mt.cgi と同じパーミションに変更します。

MTAppjQuery の設定で Data API を簡単に利用できるようにする

次に、「システムのプラグイン設定」の中の MTAppjQuery の設定を開き、 DataAPI SDK を利用有効 にし、 Data API バージョンv3 を選びます。

そして、 DataAPI Script URLを変更する をクリックして、表示された入力欄に下記のように入力します。

Movable Type を CGI で運用している場合

「mt.cgi を除く管理画面のURL + plugins/DataAPIProxy/dataapiproxy.cgi」となるようにします。

https://ホスト名/mt/plugins/DataAPIProxy/dataapiproxy.cgi

Movable Type を PSGI で運用している場合

「mt.cgi を除く管理画面のURL + dataapiproxy.cgi」となるようにします。

https://ホスト名/mt/dataapiproxy.cgi

設定を保存して準備完了です。

Data API を利用する

上記のとおり MTAppjQuery を設定すると、 mtappVars というグローバル変数の DataAPI プロパティに Data API オブジェクトがセットされます。簡単に言うと、user.js 内で下記のように利用できます。

mtappVars.DataAPI.listEntries( 引数 );

また、このオブジェクトを通して利用すると、認証が必要なエンドポイントも扱えます。

例えば、ブラウザの JapaScript コンソールで下記のコードを実行してみてください。

mtappVars.DataAPI.getUser('me', function (response) {
 console.log(response);
});

このコードは、現在ログイン中のユーザーの情報を取得するコードですので、通常は Data API の認証 が必要です。しかし、冒頭でも紹介したとおり、Data API proxy プラグインを使うと管理画面にログインしていれば Data API にもログインしていることになるので、コンソールに自分のユーザー情報が表示されるはずです。

MTAppMultiFileUpload と組み合わせる

例えば、MTAppjQuery の機能の一つに、Data API を利用して複数のファイルをサクッとアップロードする MTAppMultiFileUpload というメソッドがあります。

このメソッドは、通常は Data API の認証画面を一度通過する必要がありますが、Data API proxy を組み合わせて、 MTAppMultiFileUploadapi オプションに mtappVars.DataAPI を設定すると、Data API の認証が不要になります。

(function($){
 $('#customfield_entry_plain_text').MTAppMultiFileUpload({
 api: mtappVars.DataAPI,
 type: 'input',
 multiple: true,
 uploadPath: 'upload',
 uploadImagesPath: 'upload/images',
 uploadFilesPath: 'upload/files',
 uploadButton: '<input type="button" value="select files" class="button">'
 });
})(jQuery);

MTAppjQuery と Data API proxy を組み合わせて、さらに使いやすい管理画面にしましょう!

以上です。

Published 2017-07-21
Updated 2019-06-25

「MTAppjQuery」カテゴリの記事一覧