How to modify enterprise portal response HTML sections and response headers

[former_member193577]

Hi,

In this blog you can find 2 topics:

1. Adding response headers to the response coming back from EP server.


2. Modifying the HTML head section (or any other section in html) of the HTML response coming back from EP server.

1. Adding HTTP Response headers in Enterprise Portal

 

What is an HTTP Header (wikipedia):

HTTP header fields are components of the header section of request and response messages in the Hypertext Transfer Protocol (HTTP). They define the operating parameters of an HTTP transaction.

 

Sometimes there are cases where you would like to add headers to response. some example can be X-FRAME-OPTIONS for limiting framing or Cache-Control to control caching of the response, or  IE's X-UA-Compatible

 

Here is sample code of a portal component which adds adds an X-FRAME-OPTIONS response header to deny framing when called:

import javax.servlet.http.HttpServletResponse;

import com.sapportals.portal.prt.component.AbstractPortalComponent;

import com.sapportals.portal.prt.component.IPortalComponentContext;

import com.sapportals.portal.prt.component.IPortalComponentProfile;

import com.sapportals.portal.prt.component.IPortalComponentRequest;

import com.sapportals.portal.prt.component.IPortalComponentResponse;

public class MyHeaderComponent extends AbstractPortalComponent

{

    private static final String X_FRAME_OPTIONS = "X-Frame-Options"; //The response header key

    private static final String DENY = "DENY";  //The response header value

    public void doContent(IPortalComponentRequest request, IPortalComponentResponse response)

    {

            HttpServletResponse servletResponse = request.getServletResponse(false); //gets the original servlet response

            if(servletResponse != null) {

     

               //adds the X-FRAME-OPTIONS Header

                servletResponse.addHeader(X_FRAME_OPTIONS, DENY);                   

                response.write("My Content cannot be displayed inside an iframe!!");

            }

   }

} 

The actual magic is done in line 19.

The response of calling this portal component would be display just "My Content cannot be displayed in an iframe".

If you run it within IE inside an Iframe, you will get the following:



Notice the response header that was added : "x-frame-options" .

2. Modifing the HTML head and html sections of EP response:

 

Simple structure of an HTML page.


As you know, when working with portal components, Portal Runtime builds and creates an html response that will return to client (after going over all hooks).

It is possible to add additional html code(or remove) to the head or body sections and to change attributes of these sections.

 

At first we need to have access to the portal HTMLDocument which will allow us access to the html document sections:

 

/** Getting the PRT HtmlDocument object from the PortalComponentRequest. */

private HtmlDocument getHtmlDocument(IPortalComponentRequest request) {

     HtmlDocument htmlDocument = null;

     IPortalResponse portalResponse = (IPortalResponse) request.getValue(IPortalResponse.class.getName());

      if (portalResponse instanceof PortalHtmlResponse) {

           PortalHtmlResponse portalHtmlResponse = (PortalHtmlResponse) portalResponse;

           htmlDocument = portalHtmlResponse.getHtmlDocument();

      }

     return htmlDocument;

  }

Then in our doContent of portal component we can just add scripts to the head and play with the body:

 

public void doContent(IPortalComponentRequest request, IPortalComponentResponse response)

{

     HtmlDocument portalHtmlDoc = getHtmlDocument(request);

     Vector headHtmlElements = portalHtmlDoc.getHead().getHtmlElements();

     //writing head scripts and modifying body attribs

     headHtmlElements.add( new HtmlString( "<!-- This will appear in the head! --> " ));

     headHtmlElements.add( new HtmlString( "<script type=\"text/javascript\">alert('hello from header!') </script>" ));

  

     //setting css class of body

     portalHtmlDoc.getBody().setClass( "myCSSClass" );

     

     //setting body attributs

     portalHtmlDoc.getBody().addAttribute( "role", "application" );       

     response.write("inside body");

}

After we got the portal HTML Document, adding some html code inside the head section is done in line 7,8.

Setting class for the body section in line 11 and adding body attributes in line 14.

Finally we can still write inside the body in line 15.

Running this portal component will trigger our javascript alert and give us the following html output:



You can see a generic portal html response, but notice the additional changes we have added in our code:

• 2 lines we wrote were added into the html head section (marked in read).


• The body section now has role="application and class="myCSSClass" (marked in orange)

Inspect the getHead and getBody classes for more methods.

Try it out!


Best Regards,

Tal

You want to influence the future product roadmap of Enterprise Portal? You plan to implement your portal in the Cloud? Then you should participate in the following survey https://blogs.sap.com/2016/10/11/2016-elections-vote-now/.