What Are the Limitations and Considerations for Using Opaque Responses in Cross-Origin Requests?

Limitations and Considerations for Using Opaque Responses

Opaque responses, introduced by the Fetch API, represent the outcome of cross-origin requests when CORS is disabled. While they provide some isolation, there are several restrictions and potential issues to be aware of.

Restrictions on Headers and Body Access

The primary limitation of opaque responses is the inability to access the headers or body of the response. Properties like headers and body-related methods (json(), text()) are unavailable. This is essential to preserve the privacy of the remote origin.

Resource Usage and Limitations

Despite their limitations, opaque responses can be utilized as resources on a webpage if the browser allows non-CORS cross-origin resources. These resources include <script>, <link rel="stylesheet">, media elements (<img alt="What Are the Limitations and Considerations for Using Opaque Responses in Cross-Origin Requests?" >, <video>, <audio>), <object>, <embed>, and <iframe>. However, opaque responses are not valid for font resources.</script>

Interaction with Cache Storage API

A potential pitfall arises when using opaque responses with the Cache Storage API. Opaque responses have a status property of 0, regardless of the actual request status. Since the add() and addAll() methods reject responses with non-2XX status codes, opaque responses will fail to be added to the cache. To circumvent this, explicitly perform fetch() followed by put() with the opaque response.

navigator.storage API and Opaque Responses

For security reasons, browsers pad opaque responses to prevent cross-domain information leakage. This padding significantly increases the reported storage size of opaque responses. In Google Chrome, each opaque response contributes a minimum of approximately 7 megabytes to storage usage. This can lead to quota exceeded exceptions if not carefully managed.

Considerations for Usage

When using opaque responses, keep the following in mind:

• Opaque responses offer isolation, but restrict access to headers and body.
• They can be used as resources on web pages that allow non-CORS cross-origin resources.
• Special handling is required for use with the Cache Storage API to avoid cache addition failures.
• Beware of inflated storage size reporting for opaque responses in the navigator.storage API.

The above is the detailed content of What Are the Limitations and Considerations for Using Opaque Responses in Cross-Origin Requests?. For more information, please follow other related articles on the PHP Chinese website!