Changing the default WD-ABAP Error Page

[js2]

I recently encountered a situation where I needed to change the standard web dynpro error page to something that was seen to be a little more easy on the eye for users. The main requirement was for time-outs. It's a pretty simple task except for a couple of gotcha's that are not described in the SAP help, which I'll detail below.

The standard error page for a WD application can be changed in the ICF node. You can do this for an explicit application or for the entire WD node where your error page will be used for all sub-nodes (applications). Note that it is not necessary to copy this change to all sub-nodes - the system will automatically use your error page on all sub-nodes in the ICF.

There are two main options for creating the error page:

1) "Explicit response time"

2) "Redirect to URL"

I'll start with the second one first as I tried it out on my first attempt. Here you can insert any url which the user will be redirected to upon an application error (WD). This could be an error due to an internal short dump or a time-out.

I didn't want to have to have a page sit on some other web server so started to write an error page in BSP. However when an error occurs, the user will be asked to logon. That's not a good solution. It's even worse if you're using sso in the portal. This means I'd need to setup a service user in the ICF service for my bsp error page so that it would use the service users credentials. Again not ideal and I went back to the drawing board. (also - you don't seem to have access to any of the error variables described below when using this method.)

The first option listed above, called "Explicit response time" allows you to directly insert some data for header values (which I admit I have no idea what they are for or what the benefit is - you can't enter html here). It also lets you directly enter html for the BODY of the error page - this is what I used. I went about writing and testing the error page in eclipse and copied and pasted it into this body section.

Unfortunately the formatting of your html is lost once you have saved - so keep your offline copy available for easy editing.

Okay - so far so good... This is where I started to run into troubles though. I needed to use some basic JavaScript to check the error type and display different messages if its from a time-out or not. I also needed to be able to handle some button clicks so the user could quickly and easily refresh the page or display further details for support.

No matter what I did the JavaScript just didn't seem to get executed though. The SAP Help - was no help, as is often the case!

Luckily I came across note #1342205 which explained a few things. It seems that the onload event is not processed in the document due to the way that WD-ABAP uses ajax to insert the document into the DOM.

To get around this there is a trick that can be used. You need to use the onload event on a dummy IMG tag to get some script to execute on page load. This script is hidden within a span tag (in comments) as can be seen below:

Not the prettiest way to get some JavaScript to run on page load, but it works within the ICF error page framework. In the SPAN above you can see I do a basic check to see if the error message is a timeout or not and I change the displayed message based on this.

We have access to a suite of "error variables" (and some extra ones as shown here). You can access these on your page like this:

I wrapped some of the variables above in DIV's so I could access them in the JavaScript.

The end result looks like this:

The Reload button simple causes a page refresh which takes the user back to where there were and the Show error details button just "shows" the DIV containing all the system variables shown in the code section above - which is of more use on an application error instead of the time-out shown here. (Thanks goto john.moy3 for the 'show more details' idea.)

[mvoros]

Hi,

just a quick comment. You could set a default user for your BSP error page and expose it that anybody can access it. Hence the users would not have to log on to see an error.

Cheers

[js2]

Hi Martin, thanks for your comment. What you have suggested is what I mention above with using a "service" user. Its not a nice solution for me, having to manage a service user - plus the error variables do not seem to be available when redirecting to a web page, which is a show-stopper for our requirement.

Regards.

[mvoros]

Hi,

sorry, I misunderstood your comment about service user. I did not mean that BSP solution would be better. There is a standard system user SAPSYS that is used for all /sap/public/* services. So you could create a link to your BSP app in this folder to avoid maintaining service user.

Cheer

[js2]

SAPSYS is a good idea. I thought of using one of the standard sys users but didn't know sap uses them for all the public bsp's. Thanks for that info.

[petr_solberg]

Hi Jason,

very useful blog - thanks.

All the best,

Andy.

[Former Member]

Hi

I have just gotten this to work in our system as well, so thanks for a great post :smile:

However, the image required in the script as per note 1342205 I decided to place in the Mime Repository. That is, I uploaded it in SE80.

I can now access it by entering the path from SE80 in the script, but the browser now prompts me for a user id and a password.

It makes no difference if the ICF service logon includes a service user or no user at all.

If I simply enter my own logon information to the SAP system the image is fetched just fine, so I know the cript works.

Does anyone have any idea how to avoid this logon request?

Kind regards

Aage Kold Jensen

[js2]

Hi Aage,

Are you talking about the hidden image used to load the javascript? if so the path to is is: "/sap/public/bc/ur/nw5/1x1.gif". I never received any issues with user logon for this mime location.

I haven't used any other images that I loaded into the mime repository, just plain html and very basic css as shown below.

[Former Member]

Of cause!

I had placed my picture under a different path, which turned out to require the logon information. I have changed it now and it works and displays the logo I want it to.

Thanks for your help.

Kind regards

Aage

[soldner]

@ Jason -  Thanks very much!!  My managers like it.

However I have a problem. The onloadscript doesn't work. Got the header and buttons, all that works, but no text.

To be more specific, it works for IE9, but not for Firefox, Chrome, or Safari.  I added an alert in the onloadscript and get the popup in IE but not the others.

Any suggestions? 

[js2]

Hi Steve, we use IE8 here (unfortunately), but I've just tested it in Chrome (26) and the error page seems to work just fine.

[soldner]

Hey Jason, thank for the reply. IE9 seems to allow the eval( ), but Firefox24, Chrome 30 and Safari 57 does not.

I want to use this forthe Time and Attendance POWL. We have many managers who use ipads and tablet to approve, so other browsers are important.

I just added the any change might be lost to the msg div. When run under IE, it gets replaced by the message from the eval(). So at least there is some message.

All the buttons work!  And I see the errors, so it is still better than before.

Thanks for sharing!

[amudhavalli_workflow]

Hi Jason,

Could you please help me? While am trying the same am getting the page like this. Am I missing something? It seems like java script function is not working.

Even I tried by putting these below lines of code inside the comment <!-- <<java script function>> -->. That time, it is only showing the buttons and not the error message like whether it is time out or application error.

[amudhavalli_workflow]

Hi Jason,

Thanks much for the blog. I resolved the same. It works fine now. It really helps.

Hi Kabir,

Please find the code for the same.

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<style type="text/css">

#header{

     width:100%; 

  background: #E0251B;

  padding: 7px;  

}

#ht    {

  color : white;

  font-family: Verdana;

  Font-weight: 700;

  font-size: 14px;

}

p      {

  font-family: Verdana;

  font-size: 12px;

}

.hideme{

    display:none;

}

.showme{

  display:visible;

  font-family: Verdana;

  font-size: 12px;

}

</style>

<title> Error when processing your request </title>

</head>

<body>

<span id="onloadscript" >

<!--

var msg_text = document.getElementById("msg");

var e        = document.getElementById("errormessage");

if(e.innerHTML.indexOf("timeout") > -1){

msg_text.innerHTML = "Your session has timed out.Any changes since you last saved may have been lost. <br/>

Please click on the button below to reload the application.";

}

else{

msg_text.innerHTML = "An application error has occured.Any changes since you last saved may have been lost. <br/>

Please click on the button below to reload the application.";

}

-->

</span>

<img src="/sap/public/bc/ur/nw5/1x1.gif"

onload="

var onloadscript = document.getElementById('onloadscript');

var scriptText = onloadscript.childNodes[0].nodeValue;

eval(scriptText);" /> 

<div id="header"><p id="ht">

Error when processing your request </P>

</div>

<p id="msg"></p><br/>

<button onclick="window.location.reload()">

Reload Application</button>

<button onclick="var e=document.getElementById('hidden_div');

e.className='showme';">

Show Error Details </button> <br/>

<div id="hidden_div" class="hideme">

<P>

<div id="errorcode"><%=ERRORCODE%></div>

<div id="errormessage"><%=MESSAGE%></div>

Server Name: <%=SYHOST%><br/>

System Name: <%=SYSYSID%><br/>

Date: <%=SYDATUM%><br/>

Time:<%=SYUZEIT%><br/>

ICF error code:<%=SYECODE%><br/>

System error text:<%=SYETEXT%><br/>

ICF Url:<%=PATHTRANS%><br/>

ABAP Callstack:<%=ABAPCALLSTACK%>

</P>

</div>

</body>

</html>

[developerone]

Hi Amudha,

Thanks for the code. I resolved it too. I have missed to declare msg, errormessage :razz:

Cheers,

Kabir

[developerone]

Thanks a lot Jason. This blog helped me a lot.

Cheers,

Kabir

[js2]

No problems... Glad its a help.

[harsha_jalakam]

Hi Jason,

Thanks for sharing.

How do we transport the changes done for this to the higher landscape, does it create any transport?

PS: I havent tried this .

Regards,

Harsha

[former_member740482]

.