※本記事は2026年7月16日に米国で公開された Build with React on Salesforce: Multi-Framework Is Now GAの抄訳です。本記事の正式言語は英語であり、その内容および解釈については英語が優先されます。
Salesforce Multi-Framework は、Headless 360 Platform 上で動作するフレームワーク非依存のランタイムです。Salesforce 上でネイティブに React アプリを構築し、GraphQL でレコードをクエリし、Apex を呼び出し、UI API を通じてユーザーコンテキストを読み取ることができます — 認証やトークン管理は一切不要です。Salesforce のセキュリティおよびガバナンスモデルと、React のエコシステムを、ひとつのランタイムで利用できます。
今年初めにオープンベータとしてローンチされた Salesforce Multi-Framework が、いよいよ正式リリース (GA) となりました。これは本番環境で利用可能であり、ビジネスクリティカルなワークロードでもサポートされ、Hyperforce 上で稼働する組織ではすでに有効化されていることを意味します。
Salesforce Multi-Framework GA リリースの新機能
ベータリリース以降に変更された点は次のとおりです。
- 本番組織のサポート: 本番組織、Scratch 組織、Developer Edition 組織、Sandbox にデプロイできるようになりました
- Salesforce App ドメイン: Multi-Framework の従業員向けアプリは、新しい
salesforce.appドメイン上で動作します。これは専用のオリジンであり、ブラウザーのネイティブな同一オリジンポリシーを通じて強固なセキュリティ境界を提供します - Data SDK の更新: Data SDK が正式リリースとなり、GraphQL で Salesforce データをクエリするためのインターフェースと API が更新されました
CustomApplicationターゲット: ベータ版のAppLauncherターゲットは非推奨となり、従業員向けアプリではCustomApplicationが推奨されるようになりました
本番組織、Sandbox、Scratch 組織へのデプロイ
Multi-Framework は、Summer ’26 リリース以降のすべての Hyperforce 組織 — 本番組織、Sandbox、Developer Edition、Scratch — で利用可能になりました。従来の UiBundleSettings Scratch 構成設定は非推奨となりました。
お使いの組織が Salesforce Multi-Framework をサポートしているかどうかは、Salesforce の設定で React Development with Salesforce Multi-Framework(Salesforce マルチフレームワークを使用した React 開発) に移動することで確認できます。有効化されている組織では、「Salesforce App Domain」のトグルがオン(有効)になった状態で「About Salesforce Multi-Framework(Salesforce マルチフレームワークについて)」メッセージが表示されます。
新しい salesforce.app ドメイン
salesforce.app ドメインは、Multi-Framework の従業員向けアプリ専用の Web オリジンです。アプリの URL は https://<org>--<namespace>.<instance>.my.salesforce.app/app/c__<bundleName> というパターンに従います — 例: https://acme-corp-dev-ed--c.scratch.my.salesforce.app/app/c__myReactApp。各アプリはそれぞれ独自のオリジン上で動作するため、ブラウザーの同一オリジンポリシーがネイティブに分離を強制します。あるアプリが別のアプリの Cookie やストレージを読み取ることはできず、独自のサンドボックス化は不要になります。
Data SDK が GA に (破壊的な API 変更あり)
Data SDK (@salesforce/platform-sdk) は、React アプリが GraphQL で Salesforce レコードをクエリおよび更新できるようにするクライアントライブラリです。新しいパッケージ名になり、より明確な API サーフェスで提供されるようになりました。GraphQL のクエリおよびミューテーション自体に変更はありませんが、それらをラップするクライアントライブラリが変わりました。
クエリとミューテーションは、もはや単一の汎用的な graphql() メソッドを通じて処理されることはありません。読み取りには .query()、書き込みには .mutate() を呼び出すようになり、パラメーターのキーも操作の種類に対応します。
レスポンスの型付けもより厳密になりました。result.data は undefined になり得るものとしてモデル化されるようになったため、常に存在すると想定するのではなく、オプショナルチェイニング (result?.data?.uiapi) を使うことをおすすめします。
変更前 (ベータ):
1import { createDataSDK, gql } from '@salesforce/sdk-data';
2
3const sdk = await createDataSDK();
4// Queries and mutations both used .graphql() with a `query` key
5const result = await sdk.graphql?.<QueryResponse>({ query: MY_QUERY });
6const mutationResult = await sdk.graphql?.<MutationResponse>({
7 query: MY_MUTATION,
8 variables: { input },
9});
10
11// result.data was assumed present
12const edges = result?.data.uiapi?.query?.Account?.edges;変更後 (GA):
1import { createDataSDK, gql } from '@salesforce/platform-sdk';
2
3const sdk = await createDataSDK();
4// Reads use .query() with a `query` key
5const result = await sdk.graphql?.query<QueryResponse>({ query: MY_QUERY });
6// Writes use .mutate() with a `mutation` key
7const mutationResult = await sdk.graphql?.mutate<MutationResponse>({
8 mutation: MY_MUTATION,
9 variables: { input },
10});
11
12// result.data is now potentially undefined — optional-chain through it
13const edges = result?.data?.uiapi?.query?.Account?.edges;UIBundle メタデータの変更
Multi-Framework アプリは、App Launcher から直接レンダリングされるのではなく、Custom Application メタデータを通じてプラットフォームに接続されるようになりました。.uibundle-meta.xml 内の <target> 要素にこの変更が反映されています。従業員向けアプリでは、ベータ版の AppLauncher 値は非推奨となり、CustomApplication が推奨されます。顧客向けアプリの Experience ターゲットは変更ありません。
ベータ期間中に AppLauncher を使用していた場合は、CustomApplication に更新してください。
1<UIBundle xmlns="http://soap.sforce.com/2006/04/metadata">
2 <masterLabel>My App</masterLabel>
3 <description>A React app on Salesforce.</description>
4 <isActive>true</isActive>
5 <version>1</version>
6 <target>CustomApplication</target>
7</UIBundle>バンドルにアクセスできるようにするには、それを参照する Custom Application も必要です。Custom Application メタデータが、UI Bundle を App Launcher に結び付けます。
1<CustomApplication xmlns="http://soap.sforce.com/2006/04/metadata">
2 <label>My React App</label>
3 <navType>Standard</navType>
4 <uiBundle>c__myReactApp</uiBundle>
5 <uiType>Lightning</uiType>
6 <formFactors>Large</formFactors>
7</CustomApplication>次に、権限セットを通じてアプリケーションへの表示権限を付与します。
1<PermissionSet xmlns="http://soap.sforce.com/2006/04/metadata">
2 <applicationVisibilities>
3 <application>myReactApp</application>
4 <visible>true</visible>
5 </applicationVisibilities>
6 <label>My React App Access</label>
7 <hasActivationRequired>false</hasActivationRequired>
8</PermissionSet>ベータからの移行: 破壊的変更
ベータ版の Salesforce Multi-Framework 上で構築していた場合は、GA でデプロイする前に必ず次の 5 つの変更を行ってください。
- インポートを
@salesforce/sdk-dataから@salesforce/platform-sdkに更新します。 graphql()の呼び出しを.query()(読み取り) と.mutate()(書き込み) に分割します。result?.dataにオプショナルチェイニングを使用します — undefined になり得るためです。.uibundle-meta.xml内の<target>AppLauncher</target>を<target>CustomApplication</target>に置き換え、<uiBundle>参照を含む Custom Application メタデータファイルと、表示権限を付与する権限セットを追加します。- 非推奨となった
UiBundleSettingsScratch 構成を削除します — もう不要です。
Multi-Framework ロードマップの今後
今後構築予定の機能は次のとおりです。
- マイクロフロントエンド: 外部でホストされている React コンポーネントを、Lightning Web コンポーネントと並べて Lightning に埋め込み、それらの間でイベントを受け渡しできるようにします
- Angular サポート: Angular を皮切りに、追加のフレームワークサポートを提供していきます
- ローカリゼーション: Translation Workbench またはメタデータを使用して、Multi-Framework コンポーネントを言語・ロケール・タイムゾーンをまたいでユーザーに適応させます
- 管理パッケージ: Multi-Framework アプリケーションを管理パッケージとして構築、テスト、配布、デプロイできるようにします
- アプリ管理: 名前、説明、URL といった基本的なアプリの詳細を App Manager から表示・管理できるようにします
これらの機能のリリースに関する更新情報やニュースについては、Salesforce Developer ブログをご確認ください。
リソース
- Introducing Salesforce Multi-Framework: 詳細なウォークスルーを含むベータ発表記事
- Multi-Framework ドキュメント: セットアップガイド、API リファレンス、ベストプラクティス
- Salesforce Multi-Framework Recipes: React on Salesforce のための 20 以上のコードサンプル
著者について
Alice Oh は Salesforce の Director of Product であり、Salesforce エコシステム全体でアプリを作成・バイブコーディング・公開するための柔軟で拡張性のある基盤製品の構築に取り組んでいます。空いた時間には、最もサクサクのクロワッサンを求めてベイエリアを自転車で走り回っています。彼女のフォローや連絡は LinkedIn からどうぞ。
Charles Watkins は独学のソフトウェア開発者であり、Salesforce の Lead Developer Advocate です。ブログの執筆、コードサンプルの作成、そしてパシフィックノースウェストで新しいハイキングスポットを探すことに時間を費やしています。彼のフォローは LinkedIn からどうぞ。
