Embed images in exception pages in ProxySG

Products

ProxySG Software - SGOS

Issue/Introduction

You want to display a company logo in exception pages without using an external storage location for the image file.

Resolution

Convert the image file to a Base64 string and then use it in the HTML code. The following is a typical example of HTML code of an exception page:

<html>
<head>
<title>Access Denied</title>
</head>
<body>
<center>
<p>
<font face="Arial, Helvetica, sans-serif" size="5" color="Red"><u><b>Access Denied</b></u></font>
<p>
<font face="Arial, Helvetica, sans-serif" size="4" color="Red">INTERNET
USAGE IS MONITORED AND LOGGED.</font>
<p>
<font face="Arial, Helvetica, sans-serif" size="3" color="Red"><b> Your IP
address: $(client.address)<br>Your username: $(user.name)</b></font>
<p>
<font face="Arial, Helvetica, sans-serif" size="4" color="red">YOU HAVE
BEEN DENIED ACCESS TO THIS SITE. PLEASE READ OUR SECURITY POLICY AT
http://intranet.example.com/up.html
<p>
For any comments email <A href='mailto:support@example.com?subject=Barred
web page $(url), IP address: $(client.address), User ID:
$(user)'>Customer Service Centre</a></font>
<p>
</center>
</body>
</html>

The following example shows how to embed the Symantec logo in the HTML.

Step 1: Convert the logo picture to Base64. You can do this using a website such as https://codebeautify.org/image-to-base64-converter . The resulting image code follows:

<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKMAAAArCAYAAAAUjzg1AAAAGXRFWHRTb2Z0d2FyZQB
BZG9iZSBJbWFnZVJlYWR5ccllPAAADZ1JREFUeNrsXAl0VcUZnhA22UIR2cpeigjIaqFlkYAQsIiUpaJQBSEoGgGpKaVwbKVyS
pVFFLAsamkrRQ1UFuGUrYCAUCCyymbAICjQsoaQAElIvy/5L0wmc+97CUmI5f7n/Oe+N3e2O/Pdf533lCqklLqqaW1wOniQ8umO
oCKFcVI/qFW7V8sRCSPxcTx4l79NdwYVLUQALIlLFfn .....<snip>....<removed to reduce the size>

DBTfDwalNdgoeHMgwHdc/qHALkgxjSTjJAPHYV2WozMp8Kqpi1qu6p4Vv3Vrf/UkT+Ieh
4gLFA7TU6gX3E54OvTdwWMGih5LIvSkh53mRzak1TJbwCEa/0l9+mWwaiBkkFa/rY5XLxmxqQYR2TYhPYm1R/jfoyt8a/1VgGE
/l8i+xSQ/ifAAOPs9qE/RIvAAAAAAElFTkSuQmCC'/>

Step 2: Edit the HTML code and add the Base64 code within the body at the appropriate position.

<html>
<head>
<title>Access Denied</title>
</head>
<body>
<center>
<p><img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKMAAAArCAYAAAAUjzg1AAAAGXRFWHRTb2Z0d2FyZQB
BZG9iZSBJbWFnZVJlYWR5ccllPAAADZ1JREFUeNrsXAl0VcUZnhA22UIR2cpeigjIaqFlkYAQsIiUpaJQBSEoGgGpKaVwbKVyS
pVFFLAsamkrRQ1UFuGUrYCAUCCyymbAICjQsoaQAElIvy/5L0wmc+97CUmI5f7n/Oe+N3e2O/Pdf533lCqklLqqaW1wOniQ8umO
oCKFcVI/qFW7V8sRCSPxcTx4l79NdwYVLUQALIlLFfn .....<snip>....<removed to reduce the size>

DBTfDwalNdgoeHMgwHdc/qHALkgxjSTjJAPHYV2WozMp8Kqpi1qu6p4Vv3Vrf/UkT+Ieh
4gLFA7TU6gX3E54OvTdwWMGih5LIvSkh53mRzak1TJbwCEa/0l9+mWwaiBkkFa/rY5XLxmxqQYR2TYhPYm1R/jfoyt8a/1VgGE
/l8i+xSQ/ifAAOPs9qE/RIvAAAAAAElFTkSuQmCC'/></p> <p> <font face="Arial, Helvetica, sans-serif" size="5" color="Red"><u><b>Access Denied</b></u></font> <p> <font face="Arial, Helvetica, sans-serif" size="4" color="Red">INTERNET USAGE IS MONITORED AND LOGGED.</font> <p> <font face="Arial, Helvetica, sans-serif" size="3" color="Red"><b> Your IP address: $(client.address)<br>Your username: $(user.name)</b></font> <p> <font face="Arial, Helvetica, sans-serif" size="4" color="red">YOU HAVE BEEN DENIED ACCESS TO THIS SITE. PLEASE READ OUR SECURITY POLICY AT http://intranet.example.com/up.html <p> For any comments email <A href='mailto:support@example.com?subject=Barred web page $(url), IP address: $(client.address), User ID: $(user)'>Customer Service Centre</a></font> <p> </center> </body> </html>

Step 3: Install the new HTML code in the exception file.

Once complete, the exception page shows the following: