Hi @Yao Liang,
The error message "The page was not displayed because the request entity is too large" reflects the fact that the server is denying requests larger than some threshold. In Azure App Service, particularly for Node.js, there are default configurations that restrict the size of request bodies to help avoid misuse.
Follow the below steps to resolve the issue:
Make sure the configuration goes in the <system.webServer> section of your web.config file:
<configuration>
<system.webServer>
<security>
<requestFiltering>
<requestLimits maxAllowedContentLength="104857600" /> <!-- 100MB in bytes -->
<hiddenSegments>
<remove segment="bin"/>
</hiddenSegments>
</requestFiltering>
</security>
</system.webServer>
</configuration>
Your Node.js app might also have its own limits on how big a request can be, separate from what's in your web.config file. For example, if you use something like the body-parser middleware, it has built-in size restrictions. To allow bigger uploads you need to change those settings, this configuration sets the payload limit to 100MB for JSON and URL-encoded data. Here's how you can adjust the limit:
const express = require('express');
const bodyParser = require('body-parser');
const app = express();
// Increase the limit to 100MB
app.use(bodyParser.json({ limit: '100mb' }));
app.use(bodyParser.urlencoded({ limit: '100mb', extended: true }));
// Your routes and other middleware
Azure App Service has a limit on how big your request headers can be, a kind of maximum size for the request header. It doesn't have anything to do with how large the contents of your request are (the body), but the headers cannot exceed 64KB. So, even if you're passing on a really large file, if your headers are really large, you're going to hit a problem. Keep them under that threshold.
Before you deploy your changes to production, locally test your application with the new settings. This will ensure it is able to cope with big data loads without any issues.
Implement logging so that you are able to monitor requests and detect any errors brought about by large file sizes. This will significantly simplify troubleshooting.
After making the changes to your web.config and Node.js server, redeploy your app to Azure App Service and test submitting requests of various sizes (e.g., 50MB, 60MB, etc.).
Reference:
https://azureossd.github.io/2016/06/15/uploading-large-files-to-azure-web-apps/
Web Application Firewall request and file upload size limits
If this answers your query, do click Accept Answer and Yes for was this answer helpful. And, if you have any further query do let us know.