2月 21, 2026

App Bridge Resource Picker APIにフィルタクエリが追加されました

2月 21, 2026

App Bridge Resource Picker APIにフィルタークエリが追加されました

Shopify開発者の皆さん、新機能の情報です。App Bridgeの最新バージョンでは、Resource Picker APIと組み合わせて、フィルタークエリオプションを使用することで、リソースをフィルタリングできるようになりました。さらに、Resource Pickerの検索バーにクエリを表示せずに操作できます。

技術的課題の定義と現状分析

これまでのResource Picker APIの使用では、ユーザーが検索バーに直接クエリを入力する必要がありました。これは、特定のリソースを探す際に時間がかかり、また、クエリが直接表示されるため、一部の情報が見えてしまうという問題がありました。

具体的な技術的ソリューションの提案

この新機能により、フィルタクエリオプションを使用してリソースをフィルタリングすることが可能になります。この機能を活用することで、効率的にリソースを検索することができ、より高度なリソース管理が可能となります。

実装手順とコード例

以下に、新機能の実装手順とサンプルコードを示します。

// App Bridgeをインポートする
import createApp from '@shopify/app-bridge';
import {ResourcePicker} from '@shopify/app-bridge/actions';

// App Bridgeのインスタンスを作成する
const app = createApp({
    apiKey: 'your-api-key',
    shopOrigin: 'your-shop-origin',
});

// Resource Pickerを作成し、フィルタークエリを設定する
const resourcePicker = ResourcePicker.create(app, {
    resourceType: ResourcePicker.ResourceType.Product,
    options: {
        filter: 'product_type:shirt',
    },
});

// Resource Pickerを開く
resourcePicker.dispatch(ResourcePicker.Action.OPEN);

このコードを適用することで、Resource Pickerの検索結果は「shirt」という商品タイプを持つ商品のみになります。