Search REST API Example

The following example uses JQuery with the new WebCenter REST APIs released in PS3. The source for this example, implemented in JavaScript and html, is here. The source must be customized before use:

  • Supply the username and password for a WebCenter user by editing the relevant JavaScript variables.
  • Supply the URL of the resourceIndex for the WebCenter REST API, e.g. http://localhost/rest/api/resourceIndex.
  • Use a proxy to ensure that the sample files and the WebCenter REST API share the same domain. See below for quick steps to use apache mod_proxy to accomplish this.

Sample Overview

In this example, we create a simple new search UI that does a global search of the WebCenter instance. Links to results are displayed in a list, as shown in the screenshot:


Sample HowTo

Step 1: Get the URL Template for the Search API

The resourceIndex is a list of links that have resourceTypes and URL templates. Your code should hard code the resourceType, not the template. The URL template for the search API is found with resourceType=urn:oracle:webcenter:search:results. In JQuery:

$.ajax({url: resourceIndex, dataType: "xml", username: username, password: password, success: function(xml) {
 //first, find the link to the search api
 var link = $(xml).find("link[resourceType=urn:oracle:webcenter:search:results]");
 searchEndpoint = link.attr("template");

URL templates include all possible parameters. In some cases, we modify or remove parameters:

//for global searches, remove some parameters from the template
searchEndpoint = searchEndpoint.replace('&serviceId={serviceId}', '');
searchEndpoint = searchEndpoint.replace('&refiners={refiners}', '');
searchEndpoint = searchEndpoint.replace('&scopeGuid={scopeGuid}', '');

Step 2: Call the search API with our Query Term

We implement a simple html form with the action search(). The search() JavaScript function forms the query URL, makes the call and populates the results table with the response. In JQuery:

function search() {
 var query_term = $("#query_term").val();
 var currentSearch = searchEndpoint.replace("{q}", query_term);
 $.ajax({url: currentSearch, dataType: "xml", contentType: "application/xml;charset=UTF-8", username: username, password: password, success: function(xml) {
  var aaData = new Array();
   function() {
    var selfURLtemplate = $("//link[rel='urn:oracle:webcenter:wclink']", this).attr("href");
    var title = $(this).children("title").text();
    aaData.push(new Array("<a href='" + selfURLtemplate + ">" + title + "</a>"));
  var oTable = $('#search_results').dataTable({
   "bDestroy": true,
   "bJQueryUI": true,
   "sPaginationType": "full_numbers"

Proxy Configuration

Let's assume you are running the sample code on your local apache server (localhost) and you want to create a localhost proxy for your WebCenter REST API. Follow these steps:

  1. Uncomment the following lines in httpd.conf:
      LoadModule proxy_module modules/
      LoadModule proxy_http_module modules/
  2. Add the following lines to httpd.conf:
     ProxyPass /WebCenter/ http://my.webcenter.instance:8888/webcenter/
     ProxyPassReverse /WebCenter/ http://my.webcenter.instance:8888/webcenter/
     ProxyPass /rest/ http://my.webcenter.instance:8888/rest/
     ProxyPassReverse /rest/ http://my.webcenter.instance:8888/rest/
     ProxyPreserveHost on
  3. Save httpd.conf and restart apache.