Simple Integration for Pre-Production Environment

Overview

This chapter describes the integration steps that allows you to add Knowledge Center functionality to your site without modifying any memory. To configure the integration you need to use Proxy shipped with Genesys Web Engagement product.

The GWM Proxy is a development tool that you use to add new functionality to a website without directly modifying that site. Once you have configured this proxy, you can use the Genesys Knowledge Center Sample UI from any of your websites. In a few clicks, without modifying your website, the Knowledge Center Sample UI features shows up on a set of web pages, according to the rules and categories that you created. There are two proxy tools available in the Web Engagement installation, the Simple tool and the Advanced tool. Within this instruction you need to use the Advanced GWM Proxy. For more information regarding proxy please refer to the Genesys Web Engagement documentation.

Important

GWE Proxy provides support for easy integration into existing sites within the pre-production environment. It is not recommended to use it in a production environment. Please use similar tools available on the market.

Configuring the Advanced GWM Proxy

The Advanced GWM Proxy is based on the OWASP Zed Attack Proxy Project (ZAProxy). In addition to acting as a proxy, the Advanced GWM Proxy also provides a UI and validates vulnerabilities in your website at the same time.

Important

The Advanced GWM Proxy requires JDK 1.7 or higher.

Before you start using the Advanced GWM Proxy, you need to carry out a few configuration procedures.

Starting the Proxy

Navigate to your Web Engagement installation directory and launch either servers\proxy2\zap.bat (on Windows) or servers\proxy2\zap.sh (on Linux).

The proxy starts.

The Advanced GWM Proxy

Configuring the Proxy

Once the proxy is running, you can configure it using the GUI.

Start

1. Open Tools > Filter....
   

   Configuring the Proxy Filter
   
   Select the Filter menu item.
2. In the list of filters, select Replace HTTP response body using multiple patterns and click ... to edit the filter.
   

   List of Proxy Filters
   
   Select the filter.
3. Click Add.
4. Enter </head> in the Pattern: field of the resulting dialog box.
5. Enter the following code in the Replace with: field.

    <meta charset="UTF-8">
    <meta content="IE=Edge" http-equiv="X-UA-Compatible">
    <title>Slide box</title>
    <style>
    .gkc-inject-body {
         position: fixed;
         top: 0;
         right: -1001px;
         width: 1000px;
         transition: right 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);
         overflow: hidden;
         float: right;
         border-left: 1px solid #eee;
         border-bottom: 1px solid #eee;
         background-color: #fff;
         height: 100%;
         z-index: 1000001;
     }
     .gkc-inject-body iframe {
         border: none;
         height: 100%;
         width: 100%;
     }
     #gkc-toggle {
         display: none;
     }
     #gkc-toggle + label:after {
         font-family: "Helvetica Neue", Helvetica, sans-serif;
         text-transform: uppercase;
         transform: rotate(90deg);
         transform-origin: right top 0;
         background-color: #31b0d5;
         color: #fff;
         margin-top: 150px;
         padding: 2px 10px;
         float: left;
         cursor: pointer;
         position: fixed;
         top: 0;
         right: 0;
         transition: right 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);
         z-index: 1000001;
     }
     #gkc-toggle + label:after {
         content:"Knowledge"
     }
     #gkc-toggle:checked ~ .gkc-inject-body {
         right: 0;
     }
     #gkc-toggle:checked + label:after {
         right: 1000px;
     }
     </style>
     </head>

6. Click OK to save the pattern.
7. Click Add again.
8. Enter </body> in the Pattern: field of the resulting dialog box.
9. Enter the following code in the Replace with: field, replacing your.sample.ui.host:port with the host and port where you have configured the Sample UI.

    <div class="gkc-container" >
        <div class="gkc-slide-box" >
            <input type="checkbox" name="toggle" id="gkc-toggle" />
            <label for="gkc-toggle"></label>
            <div class="gkc-inject-body" style="background-color: white">
                <iframe src="http://your.sample.ui.host:port/gks-sample-ui/" width="980" height="800">
                    Sorry your browser does not support iFrames
                </iframe>
            </div>
        </div>
     </div>
     </body>


Entering a Filter Pattern
10. Click OK to save the pattern.

End

Configuring the URL Filter

Complete this procedure to use the GUI to configure URLs that the proxy should ignore.

Start

You can exclude a site in one of two ways:

Using the Sites Tab

1. In the Sites tab, right-click on a site and select Exclude from > Proxy.

Excluding a Site from the Proxy Filter
2. Select a site to exclude.

Using the File Menu

1. Select File > Properties. In the Session Properties window, select Exclude from proxy, add your URL regular expression, and click OK. For example, to have the proxy include only the google.com website, use this regular expression:

^((?!google.com).)*$


Adding a Regular Expression for Ignoring Sites
2. Enter a URL to exclude.

If you want the proxy to remember the excluded URLs beyond the current session, select File > Persist session... and select a file to save your session to.

End

Working with the Proxy

After you have configured the proxy, keep it open and then open up a web browser. Now you can browse through the web pages that are instrumented with the Knowledge Center Sample UI, and they will be displayed in the Sites tab of the proxy GUI, as shown here:

Browsing Your Proxy Sites

For more information about working with ZAProxy, see https://www.owasp.org/index.php/OWASP_Zed_Attack_Proxy_Project.