Skip to content

Commit

Permalink
Merge pull request #4007 from airqo-platform/custom-error-production
Browse files Browse the repository at this point in the history
Custom error Pages for Nginx production
  • Loading branch information
Baalmart authored Dec 4, 2024
2 parents f6ce34c + 5b012e8 commit e26d472
Showing 1 changed file with 132 additions and 4 deletions.
136 changes: 132 additions & 4 deletions k8s/nginx/production/global-config.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -11,16 +11,144 @@ data:
set-real-ip-from: "10.240.0.3"
location-snippets: "
auth_request /auth;
error_page 500 = @internal_server_error;
error_page 404 = @page_not_found;
error_page 403 = @access_denied;
error_page 401 = @unauthorized;"
error_page 500 = @custom_internal_server_error;
error_page 404 = @custom_page_not_found;
error_page 403 = @custom_access_denied;
error_page 401 = @custom_unauthorized;"
server-snippets: "
location @internal_server_error { return 500 '{\"success\":false, \"message\":\"Something went wrong!\", \"error\":\"Internal Server Error\"}'; }
location @page_not_found { return 404 '{\"success\":false, \"message\":\"Resource not found :(\", \"error\":\"Not Found\"}'; }
location @access_denied { return 403 '{\"success\":false, \"message\":\"Access denied :|\", \"error\":\"Insufficient Permissions\"}'; }
location @unauthorized { return 401 '{\"success\":false, \"message\":\"Invalid authentication\", \"error\":\"Unauthorized.\"}'; }
location @custom_internal_server_error {
return 500 '
<!DOCTYPE html>
<html>
<head>
<title>500 - Internal Server Error</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif; background: #f5f7fa; color: #2d3748; min-height: 100vh; display: flex; flex-direction: column; }
.container { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; text-align: center; }
.error-code { font-size: 8rem; font-weight: bold; color: #e53e3e; margin-bottom: 1rem; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); }
.title { font-size: 2rem; font-weight: 600; margin-bottom: 1rem; color: #2d3748; }
.message { font-size: 1.2rem; color: #4a5568; margin-bottom: 2rem; max-width: 600px; line-height: 1.6; }
.home-button { background-color: #e53e3e; color: white; padding: 0.75rem 1.5rem; border-radius: 0.375rem; text-decoration: none; font-weight: 500; transition: background-color 0.2s; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); }
.home-button:hover { background-color: #c53030; }
</style>
</head>
<body>
<div class=\"container\">
<div class=\"error-code\">500</div>
<h1 class=\"title\">Internal Server Error</h1>
<p class=\"message\">
Something went wrong on our end. Please try again later or contact support if the issue persists.
</p>
<a href=\"/\" class=\"home-button\">Back to Home</a>
</div>
</body>
</html>';
}
location @custom_access_denied {
return 403 '
<!DOCTYPE html>
<html>
<head>
<title>403 - Access Denied</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif; background: #f5f7fa; color: #2d3748; min-height: 100vh; display: flex; flex-direction: column; }
.container { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; text-align: center; }
.error-code { font-size: 8rem; font-weight: bold; color: #d69e2e; margin-bottom: 1rem; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); }
.title { font-size: 2rem; font-weight: 600; margin-bottom: 1rem; color: #2d3748; }
.message { font-size: 1.2rem; color: #4a5568; margin-bottom: 2rem; max-width: 600px; line-height: 1.6; }
.home-button { background-color: #d69e2e; color: white; padding: 0.75rem 1.5rem; border-radius: 0.375rem; text-decoration: none; font-weight: 500; transition: background-color 0.2s; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); }
.home-button:hover { background-color: #b7791f; }
</style>
</head>
<body>
<div class=\"container\">
<div class=\"error-code\">403</div>
<h1 class=\"title\">Access Denied</h1>
<p class=\"message\">
You don’t have permission to access this resource. If you believe this is a mistake, please contact the administrator.
</p>
<a href=\"/\" class=\"home-button\">Back to Home</a>
</div>
</body>
</html>';
}
location @custom_unauthorized {
return 401 '
<!DOCTYPE html>
<html>
<head>
<title>401 - Unauthorized</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif; background: #f5f7fa; color: #2d3748; min-height: 100vh; display: flex; flex-direction: column; }
.container { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; text-align: center; }
.error-code { font-size: 8rem; font-weight: bold; color: #dd6b20; margin-bottom: 1rem; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); }
.title { font-size: 2rem; font-weight: 600; margin-bottom: 1rem; color: #2d3748; }
.message { font-size: 1.2rem; color: #4a5568; margin-bottom: 2rem; max-width: 600px; line-height: 1.6; }
.home-button { background-color: #dd6b20; color: white; padding: 0.75rem 1.5rem; border-radius: 0.375rem; text-decoration: none; font-weight: 500; transition: background-color 0.2s; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); }
.home-button:hover { background-color: #c05621; }
</style>
</head>
<body>
<div class=\"container\">
<div class=\"error-code\">401</div>
<h1 class=\"title\">Unauthorized</h1>
<p class=\"message\">
You need to log in to access this page. Please check your credentials and try again.
</p>
<a href=\"/\" class=\"home-button\">Back to Home</a>
</div>
</body>
</html>';
}
location @custom_page_not_found {
return 404 '
<!DOCTYPE html>
<html>
<head>
<title>404 - Page Not Found</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif; background: #f5f7fa; color: #2d3748; min-height: 100vh; display: flex; flex-direction: column; }
.container { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; text-align: center; }
.error-code { font-size: 8rem; font-weight: bold; color: #4299e1; margin-bottom: 1rem; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); }
.title { font-size: 2rem; font-weight: 600; margin-bottom: 1rem; color: #2d3748; }
.message { font-size: 1.2rem; color: #4a5568; margin-bottom: 2rem; max-width: 600px; line-height: 1.6; }
.home-button { background-color: #4299e1; color: white; padding: 0.75rem 1.5rem; border-radius: 0.375rem; text-decoration: none; font-weight: 500; transition: background-color 0.2s; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); }
.home-button:hover { background-color: #3182ce; }
footer { text-align: center; padding: 1.5rem; background-color: white; color: #718096; box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.05); }
.animation { margin-bottom: 2rem; font-size: 4rem; animation: bounce 2s infinite; }
@keyframes bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-20px); } }
</style>
</head>
<body>
<div class=\"container\">
<div class=\"animation\">🤔</div>
<div class=\"error-code\">404</div>
<h1 class=\"title\">Page Not Found</h1>
<p class=\"message\">
Oops! The page you are looking for seems to have vanished into thin air.
Do not worry, you can navigate back to our home page or try searching for what you need.
</p>
<a href=\"/\" class=\"home-button\">Back to Home</a>
</div>
<footer>
© 2024 AirQo. All rights reserved.
</footer>
</body>
</html>';
}
location /airqo-rest-api-documentation { return 302 /#/api/; }
location /airqo-application-documentations { return 302 /#/mobile_app/privacy_policy; }
location /airqo-terms-and-conditions/HxYx3ysdA6k0ng6YJkU3 { return 302 /#/platform/terms_and_conditions; }
Expand Down

0 comments on commit e26d472

Please sign in to comment.