[この API を試す] パネルで不明なエラーが発生しました

現在、Apigee Edge のドキュメントを表示しています。
Apigee X のドキュメントをご確認ください。 情報

内容

統合デベロッパー ポータルからの API 呼び出しは、Unknown Error で失敗するか、[Try this API] パネルに空のレスポンスが表示されます。

エラー メッセージ

統合ポータルでは、API リクエストについて、空のレスポンスや次のエラー メッセージが表示されることがあります。

Unknown Error

[デベロッパー ツール] > [コンソール] タブに次のエラーが表示されます。

Access to XMLHTTPRequest at 'API_URL' from origin 'URL_of_Integrated_DevPortal'
has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is
present on the requested resource.

[デベロッパー ツール] > [コンソール] タブに表示される一般的なエラー メッセージは次のようになります。

考えられる原因

原因	説明	トラブルシューティングの実施対象
未処理のポリシー障害	API リクエストのランタイム フローでポリシーが失敗すると、デフォルトのエラー レスポンスが CORS ヘッダーなしで送信されます。	Edge Public Cloud ユーザー
Access-Control-Allow-Origin の複数の値	Assign Message Policy で Set の代わりに Add を使用する。	Edge Public Cloud ユーザー

原因: 未処理のポリシー障害

診断

1. 2XX 以外のレスポンスが想定される場合にのみ問題が発生することを確認します。
2. 失敗したリクエストについては、プロキシフローにポリシーがあることを確認します。
3. リクエストをトレースし、 continueOnError="false" を含むポリシーが失敗し、障害が発生しているかどうかを確認します。
1. 「はい」の場合は、エラー レスポンス フローで AssignMessage CORS ポリシーが実行されたかどうかを確認します。
2. そうでない場合は、それが問題の原因です。
   これは、 continueOnError="false" 要素を含むポリシーが失敗した場合、リクエストがエラー レスポンス フローに入るためです。エラー レスポンス フローに明示的な障害処理がない場合、ポリシーに対応するデフォルトのエラー レスポンスが返されます。このエラー レスポンスには CORS ヘッダーがありません。そのため、統合デベロッパー ポータルからの API 呼び出しは Unknown error で失敗します。

次のスクリーンショットは、エラー メッセージと成功メッセージの例を示しています。

統合ポータルの [Try this API] パネルとプロキシの [Trace] ウィンドウのエラー メッセージの例:

統合ポータルの [Try this API] パネルとプロキシの [Trace] ウィンドウの成功メッセージの例:

解像度

1. デフォルトのエラー メッセージに依存する代わりに、エラー レスポンスを処理する 障害ルールを実装する必要があります。適切なヘッダーを使用して AssignMessage CORS ポリシーを含め、 FaultRule で呼び出します。
2. 場合によっては、障害ごとに障害ルールを定義できない場合があります。そのため、デフォルトの障害ルールを実装して AssignMessage CORS ポリシーを実行できます。

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<ProxyEndpoint name="proxy-endpoint-name">
    <Description/>
    <!-- Add a default fault rule to add CORS -->
    <DefaultFaultRule name="fault-rule">
        <Step>
            <Name>add-cors</Name>
        </Step>
    </DefaultFaultRule>
    <FaultRules/>
    <!--
    <Flows />
    Rest of the proxy definition
    -->
</ProxyEndpoint>

原因: Access-Control-Allow-Origin の複数の値

診断

1. トレース セッションで Access-Control-Allow-Origin ヘッダーの値を確認します。
2. Access-Control-Allow-Origin ヘッダーには、値を 1 つだけ設定できます。複数の値を設定すると、CORS の問題が発生する可能性があります。その場合、デベロッパー ポータルはレスポンスをレンダリングできません。
3. トレースの Access-Control-Allow-Origin ヘッダーの値が
   *,*
の場合、ターゲット サーバーと AssignMessage CORS ポリシーの両方がこの値を設定していることを意味します。
4. これは、ユーザーがポリシーで Access-Control-Allow-Origin に対して <Add> element を使用した場合、またはバックエンド自体で複数の値を設定している場合に発生することがあります。

*,* と等しい Access-Control-Allow-Origin の例:

* と等しい Access-Control-Allow-Origin の例:

<Add> の使用例:

<Set> の使用例:

解像度

1. Access-Control-Allow-Origin には、1 つの値しか指定できないため、（ <Add> element ではなく） <Set> element を使用することをおすすめします。
2. または、Access-Control-Allow-Origin ヘッダーを、 AssignMessage CORS ポリシーまたはターゲット サーバーのいずれかの 1 か所にのみ設定します。

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<AssignMessage async="false" continueOnError="false" enabled="true" name="set-cors">
    <DisplayName>Set CORS</DisplayName>
    <FaultRules/>
    <Properties/>
    <Set>
        <Headers>
            <Header name="Access-Control-Allow-Origin">*</Header>
        </Headers>
    </Set>
    <IgnoreUnresolvedVariables>true</IgnoreUnresolvedVariables>
    <AssignTo createNew="false" transport="http" type="response"/>
</AssignMessage>

Apigee サポートのサポートが必要な場合は、診断情報の収集が必要な場合をご覧ください。

診断情報の収集が必要な場合

次の診断情報を収集して、Apigee Edge サポートに連絡してください。

• 組織の名前
• 環境名
• API プロキシ名
• エラーの再現に使用した完全な curl コマンド
• API リクエストのトレース ファイル
• ターゲット/バックエンド サーバーからのレスポンスの完全な出力と、ペイロードのサイズ。