Скачать или смотреть How to Configure NGINX to Only Return Valid Image Responses from the Proxy

Learn how to set up NGINX to ensure it only processes valid image responses by using Lua scripting to filter content types effectively.
---
This video is based on the question https://stackoverflow.com/q/62266308/ asked by the user 'user2477' ( https://stackoverflow.com/u/2856924/ ) and on the answer https://stackoverflow.com/a/62270123/ provided by the user 'Ivan Shatsky' ( https://stackoverflow.com/u/7121513/ ) at 'Stack Overflow' website. Thanks to these great users and Stackexchange community for their contributions.

Visit these links for original content and any more details, such as alternate solutions, latest updates/developments on topic, comments, revision history etc. For example, the original title of the Question was: How to config nginx to only return the response from the proxy in case the content-type is correct?

Also, Content (except music) licensed under CC BY-SA https://meta.stackexchange.com/help/l...
The original Question post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license, and the original Answer post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license.

If anything seems off to you, please feel free to write me at vlogize [AT] gmail [DOT] com.
---
How to Configure NGINX to Only Return Valid Image Responses from the Proxy

When working with NGINX as a reverse proxy, it’s essential to manage how responses are handled based on their content type. Many developers encounter situations where a proxy might incorrectly return a non-image response (for example, an error message in JSON format) when it should not. In this post, we will discuss how to configure NGINX to only accept valid image responses and return a 500 error page for any invalid responses. This can help maintain a seamless user experience and ensure that only the desired content types are served.

The Problem

Imagine a scenario where your application relies on serving images from a proxy server (like image_server:8000). Under normal circumstances, the proxy should deliver content with the content type image/png or similar image types. However, if the proxy encounters an issue, such as being out of bandwidth, it may return a JSON response instead, even if it has a 200 HTTP status code. This can confuse users and disrupt the content display on your site.

What’s a Better Approach?

To ensure that your users only receive valid image responses, you want to set up NGINX to look at the content type of the response. If the content type is anything but an image type, NGINX will trigger a 500 error page instead of showing the incorrect content. This gives you more control over your application’s behavior and enhances user experience.

The Solution

Using the OpenResty module with Lua scripting is an effective way to handle this content filtering in NGINX. Here’s how to do it:

Setting Up NGINX with Lua

Configure the Location Block: In your NGINX configuration file, you’ll define a location block. Here, you will set the proxy_pass directive to the image server.

Add Lua Header Filter: Incorporate a Lua block that checks the content type of the response headers.

Here’s a step-by-step guide on how to implement this solution:

NGINX Configuration Example

[[See Video to Reveal this Text or Code Snippet]]

or using a more general condition:

[[See Video to Reveal this Text or Code Snippet]]

Breakdown of the Code

proxy_pass: This directive points to the backend server where your images are hosted.

header_filter_by_lua_block: This block allows Lua code execution during response header processing.

Checking Content: The string.find() function checks for the presence of json in the Content-Type header. If found, ngx.exit(500) is called to stop processing and return an HTTP 500 error.

General Check for Images: The second option checks that the Content-Type starts with "image/". If it doesn’t, it triggers a 500 error.

Conclusion

By implementing this configuration, you can ensure that your application only serves valid image content, preventing unwanted JSON responses from disrupting user experience. This solution utilizes the power of OpenResty and Lua in NGINX to effectively filter out invalid responses. Now you can maintain cleaner error handling and ensure that your content delivery system is robust against misconfigurations or service outages when serving images.

If you have any questions or need further clarifications on setting this up for your server, feel free to ask in the comments!