How to make an HTML page with graphics and scripts using an HTTP provider

This example demonstrates a way to manage an HTML presentation with images, external style sheets, or JavaScript files in an HTTP provider for Wowza Streaming Engine™ media server software.

  1. Using the Wowza IDE, create a new Wowza Server Project, then create a new HTTP provider and copy this HTTP provider:
    package com.wowza.wms.example.module.http;
    
    import java.io.*;
    import com.wowza.wms.http.*;
    import com.wowza.wms.vhost.*;
    import java.util.List;
    import java.util.Map;
    
    public class HTTPresentation extends HTTProvider2Base {
    
    	public void onHTTPRequest(IVHost vhost, IHTTPRequest req, IHTTPResponse resp) {
    
    		if (!doHTTPAuthentication(vhost, req, resp))
    			return;
    
    		req.parseBodyForParams(true);
    
    		Map<String, List<String>> params = req.getParameterMap();
    
    		if (req.getQueryString()=="")
    		{
    			new FileResponder(resp, "/assets/wowza.html");
    		}
    		if (params.containsKey("file")) {
    			new FileResponder(resp, "/assets/" + params.get("file").get(0));
    		}
    	}
    	class FileResponder
    	{
    		FileResponder(IHTTPResponse resp, String loc)
    		{
    			try
    			{
    		       InputStream is = this.getClass().getResourceAsStream(loc);
    		       BufferedInputStream inf = new BufferedInputStream(is);
    		       OutputStream out = resp.getOutputStream();
    
    		       byte[] bytes = new byte[4096];
    		       while(true)
    		       {
    	               int byteRead = inf.read(bytes);
    	               if (byteRead < 0)
    	                       break;
    	               out.write(bytes, 0, byteRead);
    		       }
    			}
    			catch (Exception e)
    			{
    			}
    		}
    	}
    }
  2. Add the HTTP provider to the /conf/VHost.xml /HostPort (1935) /HTTProviders.

    Put this second-to-last in the list (above com.wowza.wms.http.HTTPServerVersion):
    <HTTPProvider>
    	<BaseClass>com.wowza.wms.example.module.http.HTTPresentation</BaseClass>
    	<RequestFilters>*presentation</RequestFilters>
    	<AuthenticationMethod>none</AuthenticationMethod>
    </HTTPProvider>
  3. From the Java code above, note the following line:
    if (req.getQueryString()=="")
    {
    	new FileResponder(resp, "/assets/wowza.html");
    }
    Create a package named assets. Create a new file named wowza.html in this package location, and then add this HTML:
    <html><head>
    <link rel="stylesheet" type="text/css" href="?file=wowza.css" />
    <script src="?file=wowza.js"></script>
    <title></title></head>
    <body>
    <img src="?file=header.gif">
    </body></html>
  4. Now note the following line from the HTTP provider:
    if (params.containsKey("file")) {
    	new FileResponder(resp, "/assets/" + params.get("file").get(0));
    }
    This serves the requests from HTML tags such as IMG, LINK, and SCRIPT. There is one of each in the HTML above:
    <link rel="stylesheet" type="text/css" href="?file=wowza.css" />
    <script src="?file=wowza.js"></script>
    <img src="?file=header.gif">
    For this HTML page to work properly, add these three files to the /assets package in the Wowza IDE:
    • wowza.css
    • wowza.js
    • header.gif
  5. View in a browser:
    http://[wowza-ip-address]:1935/presentation

With this in place, you can manage an HTML presentation from these files in the /assets package.

Files you add to the /assets package are included the compiled .jar file. You can put images and other files on a web server and use absolute URLs to those resources.


Originally Published: 10-03-2010.

If you're having problems or want to discuss this article, post in our forum.