Amazonで商品を見るセール会場へ

PhotoshopのUXPスクリプト入門|PSJS・awaitとJSXとの違い

UXPスクリプトは、.psjsというJavaScriptファイルからPhotoshopを操作する仕組みです。

スタンドアロンの実行はPhotoshop 23.5以降で使えます。

JSXの拡張子を変えるだけの移行ではなく、API・非同期処理・画面とファイル権限を確認します。

2026年10月17日に、この記事の2つの例をPhotoshop 2026(27.11.0)で実行し、結果を各節に書き足しました。

目次

最初は文書の情報を読む

練習ZIPのscene-landscape.jpgを作業コピーで開き、article-1362-report.psjsを[ファイル]→[スクリプト]→[参照]から実行します。

文書名と400×200pxの表示を確認する例で、画像の内容や寸法は変更しません。

文書がない場合は、開いてから試すメッセージを表示します。

const { app, core } = require("photoshop");
if (app.documents.length === 0) {
    await core.showAlert("No document is open. Open a practice image and try again.");
} else {
    const doc = app.activeDocument;
    await core.showAlert("Document: " + doc.name + "\nSize: " + doc.width + " x " + doc.height + " px");
}

app.documents.lengthやdoc.widthなどのプロパティを読む処理と、完了を待つAPIを区別します。

showAlertの前にはawaitを置いて、ダイアログの処理を待ちます。

通常のブラウザーやNode.jsのAPIが、そのままPhotoshop UXPにあるとは判断しないでください。

スクリプトは[ファイル]→[スクリプト]→[参照]から選びます。

Photoshopのファイルメニューからスクリプトの参照を選ぶ操作
2026-10-12撮影。Adobe Photoshop 27.11 (20260929.r.26 8c16e56)、Windows 11 Pro (10.0.26200)。実機画面、原寸保存。

ファイルの選択画面では、ファイルの種類の欄に、.PSJSなどのJavaScriptファイルが対象として表示されていました。

Photoshopで自作PSJSスクリプトファイルを選択
2026-10-12撮影。Adobe Photoshop 27.11 (20260929.r.26 8c16e56)、Windows 11 Pro (10.0.26200)。実機画面、原寸保存。

文書情報を読む例を実行した結果

2026年10月17日に、Adobe Photoshop 2026(27.11.0)とWindows 11 Pro(10.0.26200)で、上のコードを書き換えずに article-1362-report.psjs として保存し、[ファイル]→[スクリプト]→[参照]から実行しました。

プラグインやUXP Developer Toolなどの追加の導入はしていません。

「読み込み」の窓でファイルを指定して[読み込み]を押すと、少し間をおいて「Adobe Photoshop」という題名の窓が開きました。

練習ZIPの scene-landscape.jpg を開いた状態では、文書名と「Size: 400 x 200 px」が表示されました。

Photoshopの窓に「Document: scene-landscape.jpg」と「Size: 400 x 200 px」が表示された画面
2026-10-17撮影。Adobe Photoshop 2026 (27.11.0)、Windows 11 Pro (10.0.26200)。文書情報を読む例を書き換えずに.psjsとして[ファイル]→[スクリプト]→[参照]から実行したときの表示(窓の部分だけ切り出し)。

窓には赤い×印のアイコンが付きますが、この例ではエラーではなく core.showAlert のメッセージです。

実行の前後で、文書の寸法・レイヤー・ヒストリーは変わらず、未保存の印も付きませんでした。

文書を1つも開いていない状態で実行すると、「No document is open. Open a practice image and try again.」と表示され、ほかには何も起きませんでした。

練習画像はスクリプトで開いて準備したため、画面の[開く]から開く操作は確認に含めていません。

スポンサーリンク

新しい未保存の文書を作る

作業中の文書は自分で保存して閉じ、article-1362-create.psjsを実行します。

この例は文書が開いている場合に停止し、空の状態から256×128px、RGB・8bit、72ppi、透明背景の新しい練習文書とレイヤーを作ります。

既存画像を閉じたり、保存先へファイルを書いたりする処理はありません。

const { app, core } = require("photoshop");
if (app.documents.length !== 0) {
    await core.showAlert("Save and close your current documents before this practice.");
} else {
    try {
        const doc = await app.documents.add({
            name: "CGM UXP Practice",
            width: 256,
            height: 128,
            resolution: 72,
            depth: 8,
            mode: "RGBColorMode",
            fill: "transparent"
        });
        await doc.createLayer({ name: "CGM practice layer" });
        await core.showAlert("Created a new unsaved practice document: " + doc.name +
            "\nSize: " + doc.width + " x " + doc.height + " px");
    } catch (e) {
        await core.showAlert("Practice failed: " + e.message +
            "\nIf a new practice document remains open, inspect it before closing without saving.");
    }
}

app.documents.addはPromiseを返すため、awaitで文書作成を待ってから、その文書にレイヤーを作ります。

レイヤー作成も待ってから完了表示を出します。

作成後は文書名、256×128pxの寸法、CGM practice layerというレイヤーを確認し、不要な練習文書は保存せず閉じます。

途中でレイヤー作成などが失敗した場合、新しい練習文書だけが残る可能性があります。

エラーメッセージを読み、残った文書の内容を確認してください。

エラーが表示されたのに、作成途中の文書を完成品として保存しないようにします。

新しい文書を作る例を実行した結果

同じ日に、上のコードを書き換えずに article-1362-create.psjs として保存し、[参照]から実行しました。

練習画像を開いたまま実行すると、「Save and close your current documents before this practice.」と表示され、新しい文書は作られませんでした。

練習画像を保存せずに閉じ、文書が1つもない状態で実行すると、完了のメッセージに文書名「CGM UXP Practice」と「Size: 256 x 128 px」が表示されました。

Photoshopの窓に「Created a new unsaved practice document: CGM UXP Practice」と「Size: 256 x 128 px」が表示された画面
2026-10-17撮影。Adobe Photoshop 2026 (27.11.0)、Windows 11 Pro (10.0.26200)。文書を閉じた状態で新しい文書を作る例を[参照]から実行したときの完了表示(窓の部分だけ切り出し)。

できた文書は256×128px、RGB・8bit、72ppiで、背景レイヤーのない未保存の文書でした。

レイヤーパネルには、上に「CGM practice layer」、その下に「レイヤー 1」が並びました。

Photoshopのレイヤーパネルに「CGM practice layer」と「レイヤー 1」が並んだ画面
2026-10-17撮影。Adobe Photoshop 2026 (27.11.0)、Windows 11 Pro (10.0.26200)。新しい文書を作る例を実行した後のレイヤーパネル。上の「CGM practice layer」がスクリプトで足したレイヤー(パネルの部分だけ切り出し)。

「レイヤー 1」は文書を作った時点でできていたもので、スクリプトが足したのは「CGM practice layer」の1つです。

ヒストリーには「新規」と「新規レイヤー」の2つが記録されていました。

練習文書は確かめた後、保存せずに閉じました。

レイヤー作成に失敗したときの表示(catchの部分)は、失敗する条件を作っていないため確かめていません。

別の例として、スクリプトの完了を待ってレイヤーを追加したときの画面です。

PhotoshopのPSJS実行で作成した複製文書と追加レイヤー
2026-10-12撮影。Adobe Photoshop 27.11 (20260929.r.26 8c16e56)、Windows 11 Pro (10.0.26200)。自作PSJSをアプリ内で実行し、自作サンプルの複製と空のピクセルレイヤー追加を確認。

レイヤーパネルに、スクリプトが追加した「PSJS await completed」というレイヤーが出ていました。

JSXから移すときの違い

確認する項目JSXスタンドアロンPSJS
実行するファイル.jsx、ExtendScript.psjs、UXP
アプリへアクセスグローバルのappなどrequire('photoshop').app
処理の完了待ち従来DOMは同期処理Promiseを返すメソッドはawait
UIScriptUIのdialogUXPのダイアログとawait showModal
ファイル選択File・Folderuxp.storage.localFileSystemのピッカー

UXPではES6などの新しい構文が使えますが、DOMメソッドや列挙値はExtendScriptと同じとは限りません。

画像を変更する処理を移す前に、まず文書情報を読む小さい例で実行経路を確認してください。

JSXの入力欄・ボタンはScriptUIのダイアログ例で確認できます。JSXとPSJSの初回実行はスクリプトを参照から実行する手順を使い、それぞれの拡張子で試してください。

押さえておきたい最新仕様と注意点

2026年10月12日に、Photoshop実機の日本語表示で、スクリプトの実行までの画面を確認しました。

  • [スクリプト]のメニューに、[参照]が並んでいた
  • ファイルの選択画面で、.PSJSを含むJavaScriptファイルを選べた
  • スタンドアロンの実行はPhotoshop 23.5以降
  • メニューの名前や並びは、版によって変わることがある

実行前に、練習用の画像で試してください。

あなたはどっち?JSXかUXPかを選ぶ判定フロー

スクリプトの種類は、使っている環境と目的から選びます。

  1. Photoshop 23.5以降で、ファイルから実行するスクリプトを書く:スタンドアロンの.psjs(UXP)を使えます。
  2. JSXの入力欄やボタンを使いたい:JSXのScriptUIのダイアログで作ります。UXPでは、UXPのダイアログとawait showModalを使います。
  3. JSXから移したい:拡張子を変えるだけではなく、API・非同期処理・画面とファイル権限を確認します。
  4. 画像を変更する処理を移したい:先に、文書情報を読む小さい例で、実行経路を確認します。
  5. 権限の追加やパネルが必要:スクリプトとプラグインを分けて検討します。Networkなどのモジュールは、スタンドアロンでは許可されないものとして説明されています。

どちらの場合も、呼び出す場所(スタンドアロンかプラグインか)の仕様を確認してから書きます。

スタンドアロンとプラグインを分ける

Adobeのスタンドアロン.psjsサンプルは、await app.documents.addなどをexecuteAsModalで包まずに実行しています。

一方、プラグインから文書を変更する処理にはモーダル実行のルールがあります。

プラグイン用の説明をそのままPSJSへ足したり、PSJSの例をそのままプラグインのボタン処理に移したりせず、呼び出す場所の仕様を確認します。

スタンドアロンでもLocalFileSystemのファイル選択から保存先を選べます。

利用できないプラグイン用データフォルダーやwindow.localStorageと、ユーザーが選ぶ保存先は別です。

「保存先フォルダーへ一切アクセスできない」とは説明しません。

自動上書きや任意パスへの無制限アクセスを許す仕組みでもありません。

Adobeのスタンドアロン資料では、NetworkやLaunchProcessなどのモジュールは許可されないものとして説明されています。

権限の追加やパネルが必要な用途では、スクリプトとプラグインを分けて検討します。

通常のalert、prompt、confirmの代わりに、この例ではPhotoshopのcore.showAlertを使います。

よくある質問:UXPスクリプトで迷ったときのチェックリスト

.psjsは、どのバージョンから使えますか?

スタンドアロンの実行は、Photoshop 23.5以降で使えます。

JSXの拡張子を.psjsに変えれば動きますか?

動きません。JSXの拡張子を変えるだけの移行ではなく、API・非同期処理・画面とファイル権限を確認します。JSXは.jsx(ExtendScript)で、PSJSは.psjs(UXP)です。

2026年10月17日にPhotoshop 27.11.0で、JSXのコードを中身はそのままにして拡張子だけ .psjs にし、[参照]から実行したところ、メッセージもエラーの窓も出ず、何も起きませんでした。

awaitは、いつ付けますか?

Promiseを返すメソッドにはawaitを付けて、完了を待ちます。たとえばapp.documents.addはPromiseを返すため、awaitで文書作成を待ってから、その文書にレイヤーを作ります。showAlertの前にも、ダイアログの処理を待つためにawaitを置きます。

スクリプトファイルが見つからないときは?

ファイルが.psjs.txtになっていないかを確認します。

requireやawaitの構文エラーが出るときは?

JSXとして実行していないかを確認します。文書作成の失敗では、Photoshopの版とAPIの条件を確認してください。

この記事の文書情報を読む例を、中身はそのままにして拡張子だけ .jsx にして実行すると、「Error」という題名の窓が開きました。

1行目の const { app, core } = require("photoshop"); で止まり、「エラー 17: 変数名が必要です。」と「ライン: 1」が表示されました(2026年10月17日、Photoshop 27.11.0)。

エラーの文に「require」や「await」の語が出るとは限らないので、行番号とファイルの拡張子を確かめてください。

Photoshopの「Error」の窓に「エラー 17: 変数名が必要です。」と「ライン: 1」が表示された画面
2026-10-17撮影。Adobe Photoshop 2026 (27.11.0)、Windows 11 Pro (10.0.26200)。文書情報を読む例を、中身はそのままで拡張子だけ.jsxにして実行したときのエラー(窓の部分だけ切り出し)。

alert・prompt・confirmは使えますか?

通常のalert、prompt、confirmの代わりに、この記事の例ではPhotoshopのcore.showAlertを使います。ブラウザーやNode.jsのAPIが、そのままPhotoshop UXPにあるとは判断しないでください。

スポンサーリンク

実行できないときと確認範囲

ファイルが見つからない場合は.psjs.txtになっていないか確認します。

requireやawaitの構文エラーではJSXとして実行していないかを、文書作成の失敗ではPhotoshopの版とAPI条件を確認してください。

UXP Developer Toolは1.6以降のDebug Scriptが案内されています。

2026年10月3日に、Adobeの実行手順、実行コンテキストと許可モジュール、スタンドアロンの公式サンプル、Documents.add、文書作成オプションを確認しました。

2026年10月17日に、Adobe Photoshop 2026(27.11.0)とWindows 11 Pro(10.0.26200)で、本文の2つのスクリプトを書き換えずに .psjs として[参照]から実行しました。

確かめたのは、文書の有無による表示の違い、練習画像の文書名と寸法の表示、新しい練習文書とレイヤーの作成までです。

失敗時の制御(catchの部分)は、明示的モックでだけ確認しています。

2026年10月12日には、Photoshop実機で別のサンプルを実行し、レイヤーが追加されるところまで確認しました。

UXP Developer Toolを使ったデバッグとコンソールの出力、Macとほかの版での動作は確かめていません。

次に学ぶ・作業環境を選ぶ

学習を続けたい方や、作業環境を整えたい方は、目的に合うガイドをご覧ください。

Photoshopのおすすめ書籍

動作要件とPCの確認項目

周辺機器の優先度

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次