Editing iRule for Maintainance Page with image local in F5 Big-IP iFile

Question

Dear Community,I hope this message finds you well.I am reaching out to request your assistance in editing the iRule to redirect users to a maintenance page when all nodes are down. While the iRule is currently functioning as intended, I would like to incorporate images that represent our organization and application for users. I have successfully uploaded the images to F5 using iFile however, I am uncertain about how to reference these images within the HTML code of the iRule.Attached below, you will find a screenshot of the current page and a visual representation of the desired maintenance page.&nbsp;The code below:===================================================================================&nbsp;when HTTP_REQUEST {&nbsp; &nbsp; if { [active_members [LB::server pool]] == 0 } {&nbsp; &nbsp; &nbsp; &nbsp; HTTP::respond 503 content "&lt;!DOCTYPE html&gt;&lt;html lang='en'&gt;&lt;head&gt;&nbsp; &nbsp; &lt;meta charset='UTF-8'&gt;&nbsp; &nbsp; &lt;meta name='viewport' content='width=device-width, initial-scale=1.0'&gt;&nbsp; &nbsp; &lt;title&gt;Maintenance Page&lt;/title&gt;&nbsp; &nbsp; &lt;style&gt;&nbsp; &nbsp; &nbsp; &nbsp; body {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-family: Arial, sans-serif;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; background-color: #f4f4f4;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; color: rgb(27, 131, 111);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; display: flex;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; justify-content: center;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; align-items: center;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; height: 100vh;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin: 0;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; text-align: center;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; .container {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; background: white;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding: 20px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-radius: 8px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; h1 {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-size: 2em;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin: 0;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; p {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-size: 1.2em;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; .logos {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin-bottom: 20px;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; .logos img {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; height: 150px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin: 0 15px;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; .gear-icon {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-size: 3em;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; color: rgb(27, 131, 111);&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; @media (max-width: 600px) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; h1 {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-size: 1.5em;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; p {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-size: 1em;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &lt;/style&gt;&lt;/head&gt;&lt;body&gt;&nbsp; &nbsp; &lt;div class='container'&gt;&nbsp; &nbsp; &nbsp; &nbsp; &lt;div class='logos'&gt;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;img src='/iFiles/Blackboard-LOGO' alt='Blackboard Logo'&gt;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;img src='/iFiles/PSAU-LOGO' alt='PSAU Logo'&gt;&nbsp; &nbsp; &nbsp; &nbsp; &lt;/div&gt;&nbsp; &nbsp; &nbsp; &nbsp; &lt;h1&gt;We'll be back soon!&lt;/h1&gt;&nbsp; &nbsp; &nbsp; &nbsp; &lt;p&gt;Our website is currently undergoing maintenance. We are working hard to improve your experience. Stay tuned!&lt;/p&gt;&nbsp; &nbsp; &nbsp; &nbsp; &lt;p&gt;! الموقع حاليا تحت الصيانة, نحن نعمل بجد لتحسين تجربة المستخدم، ترقبوا&lt;/p&gt;&nbsp; &nbsp; &nbsp; &nbsp; &lt;div class='gear-icon'&gt;⚙️&lt;/div&gt;&nbsp; &nbsp; &lt;/div&gt;&lt;/body&gt;&lt;/html&gt;&nbsp; &nbsp; &nbsp; &nbsp; " "Content-Type" "text/html"&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; switch [HTTP::uri] {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "/iFiles/Blackboard-LOGO" {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; HTTP::respond 200 content [ifile get "Blackboard-LOGO"] "Content-Type" "image/png"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "/iFiles/PSAU-LOGO" {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; HTTP::respond 200 content [ifile get "PSAU-LOGO"] "Content-Type" "image/png"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; default {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; # Optionally handle requests for other pages here&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }}&nbsp;=================================================================================&nbsp;&nbsp;Thank you in advance for your support.RegardsOmran Mohamed&nbsp;

faresnani · Answer

Dear Michael,Thank you for your support and thorough explanation; it has greatly enhanced my understanding of how to use iRule with iFile.Initially, I encountered difficulties, likely due to my limited coding experience. However, your expertise and suggestions, combining it with AI, helped resolve the issue. below is the result&nbsp;&nbsp;iRule=============================================================when HTTP_REQUEST {&nbsp; &nbsp; if { [active_members [LB::server pool]] == 0 } {&nbsp; &nbsp; &nbsp; &nbsp; set uri [HTTP::uri]&nbsp; &nbsp; &nbsp; &nbsp; switch -glob $uri {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "/iFiles/Blackboard-LOGO" {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; HTTP::respond 200 content [ifile get "Blackboard-LOGO"] "Content-Type" "image/png" "Cache-Control" "no-cache" "Connection" "Close"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "/iFiles/PSAU-LOGO" {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; HTTP::respond 200 content [ifile get "PSAU-LOGO"] "Content-Type" "image/png" "Cache-Control" "no-cache" "Connection" "Close"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; default {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; HTTP::respond 503 content [ifile get "BBApp-maintainance-page.html"] "Content-Type" "text/html" "Cache-Control" "no-cache" "Connection" "Close"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }}&nbsp;===================================================================&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;I sincerely appreciate your assistance.&nbsp;RegardsOmran Mohamed

faresnani · Answer

The images uploaded into F5 iFile&nbsp;

michael_saleem · Answer

Hi Omran,
Below is the approach that I personally use when creating a maintenance page. It involves creating 3 x iFiles on the BIG-IP; one for your maintenance page HTML, and two others for your logo images. You can then use a switch glob statement to get the BIG-IP to display these files.
Steps
1. Grab all of your maintenance page HTML code and save it into a new file named "maintenance.html"
2. Import maintenance page as an iFile:
&nbsp; a) Import file in "System iFile List" via GUI: System &gt; File Management &gt; iFile List &gt; Import
&nbsp; b) Create iFile in "iRule iFile List" via GUI: Local Traffic &gt; iRules &gt; iFile List
&nbsp;
3.Create iRule and apply to virtual server
when HTTP_REQUEST {
    if { [active_members [LB::server pool]] == 0 } {
        switch -glob [HTTP::uri] {
            "*Blackboard-LOGO" { HTTP::respond 200 content [ifile get "Blackboard-LOGO"] "Content-Type" "image/png" "Cache-Control"  "no-cache" "Connection" "Close" }
            "*PSAU-LOGO" { HTTP::respond 200 content [ifile get "PSAU-LOGO"] "Content-Type" "image/png" "Cache-Control"  "no-cache" "Connection" "Close" }
            default { HTTP::respond 503 content [ifile get "maintenance.html"] "Content-Type" "text/html" "Cache-Control"  "no-cache" "Connection" "Close" }
        }
    }
}
If you try this, let me know whether or not this works for you.Cheers,Michael

faresnani · Answer

Dear Michael,&nbsp;Thank you for your support and detailed explanation, unfortunately, it didn't work for me I got the below result&nbsp;

michael_saleem · Answer

Hi Omran,
Apologies, I have updated the the iRule code in my original reply (I was referencing the $URI variable which I did not declare). This should hopefully be fixed now, Please try copying and pasting the iRule again.

Forum Discussion

Editing iRule for Maintainance Page with image local in F5 Big-IP iFile

8 Replies

Welcome! a la Communidad DevCentral LATAM de F5!

The New F5 Certified BIG-IP Administrator Certification Exams Now Live

Recent Discussions

Recommended Study Guide, Books or Labs for F5 ASM/AWAF Module

Exchange cert upgrade on F%

email alert when service restarts

Unable to download files greater than 4GB. Running version 15.1.5.1

F5 Distributed Cloud Services Simulator Connect

Related Content

Re: Get Started with BIG-IP Virtual Edition (VE), BIG-IQ VE or BIG-IP Cloud Edition Trial

Maintaining BIG-IP's Golden Compliance Configuration in Financial Services

Installing BIG-IP Next on Nutanix Community Edition

Quick Optimizations for F5 BIG-IP Virtual Edition

F5 BIG-IP Zero Trust with BIG-IP SSL Orchestrator

ABOUT DEVCENTRAL

RESOURCES

SUPPORT

PARTNERS