IllustratorとPhotoshopの画像編集をNode.jsでやりとりする
html, Illustrator, javascript, Photoshop
前回よりローカルのサーバーを通じてアプリ間の連携を紹介しましたが今回は応用編としてIllustrator内で配置、レイアウトした写真画像をPhotoshopで再度開いて編集、更新、その後Illustratorで再編集、PDF書き出しといったやりとりをNode.jsでやりたいと思います。Illustrator内に配置した写真画像の色調補正の再補正等、いちいちPhotoshopに戻って開いて、書き出し、再度Illustrator側で開くといった事が多いと思うのでこのあたりの作業を自動化させたいと思いました。特にDTPや印刷、出力の際にIllustratorデータをPDFやらpostscriptファイルやらに変換してプリンターに投げるといった事も多いと思うので写真画像を色調補正するためだけに一々Illustratorで再度書き出すといった手間は面倒なものです。という訳でまずはIllustratorからドキュメントに配置された画像データを取得してPhotoshopで配置画像を開く処理。
jsxで配置画像の情報を取得、Promiseで返すのはサーバーとのやりとりも非同期になるためコールバック地獄を避けるためにasync, awaitを使って整理しながら処理。
jsxから取得した配置画像データをfetchでPhotoshopに投げます。ローカルサーバー,3000は今からPhotoshop側で立てます。
POSTで受け取ったIllustratorから送られた配置データをPhotoshop側のパネルで取得してhtmlで書き込み。これでPhotoshop側でいつでも画像データを取得できるようになります。
htmlでopenLists idの埋め込まれたボタンをクリックすると登録した画像データを開くようにしました。さらにPhotoshopで画像データを編集後にIllustratorでPDFで書き出ししたいと思います。
PDFに変換するIllustratorドキュメントのパスをPhotoshopから送信します。
Illustratorでドキュメントデータを受信して開く、または開いてそのままPDF保存します。詰めていけば個々の場面に応じて完全な自動化も実現できそうです。今回のコードもgithubにて公開しています。