Learn How to Setup a Web Server For Zebra Browser Print
The Zebra Browser Print v1.2.1.279 was released recently on Nov. 22, 2018. You can download the latest release of the Browser Print from the Browser Print Product Page. Since this release, the Web Server is now required in order to test and use the Browser Print. This blog is a tutorial on how to install the Browser Print and how to set up the Windows IIS Web Server or the Apache Web Server on a Windows computer.
1. Download & install the Browser Print
The Browser Print installer for Windows and for macOS can be found on the Browser Print Product Page. On Windows computer, the Browser Print is installed in "C:\Program Files (x86)\Zebra Technologies\Zebra Browser Print" folder by default. Once it’s installed successfully, you will see a Zebra icon on the Windows status bar as shown below. This means that the Browser Print is up and running.
If right click on the Zebra icon, you would see the Settings, About and Exit menu as shown below. You can refer to this Browser Print User Guide, which is also hosted on the Browser Print Product Page, for all the details about the menu.
2. Set up the Web Server
The Browser Print provides a sample demo, which is in the folder of "C:\Program Files (x86)\Zebra Technologies\Zebra Browser Print\Documentation\BrowserPrint.js\Sample" by default. To run and test this sample demo (and use the Browser Print in general), a Web Server is needed to host the sample demo in order for the demo to properly function. There are two simple approaches to set up a Web Server, i.e. using the Windows Internet Information Services (IIS) or using Apache. If you open the ..\Sample\index.html file directly in a browser without a Web Server, the sample demo would not function properly.
2.1. Using Apache
1) A simple way to set up a Web Server is to use Apache binaries, which can be downloaded for Windows from the Apache Haus site. Depending on the Windows computer used, you can either download the 32-bit binaries or the 64-bit binaries.
2) Unzip the downloaded package of the binaries and copy the \Apache24 folder to C:\ drive as C:\Apache24, which is the SRVROOT in httpd.conf file.
3) Copy the C:\Program Files (x86)\Zebra Technologies\Zebra Browser Print\Documentation\BrowserPrint.js folder to C:\Apache24\htdocs directory.
4) Rename the C:\Apache24\htdocs\ index.html file to C:\Apache24\htdocs\ index.html.apache, as you'll want to see the folders in the browser, not the default Apache demo page.
5) In C:\Apache24\conf\httpd.conf file, you can give a new port number if the port 80 has already been used. In this case, for example, we'll use the port 4443 as the port 80 is already occupied on our computer. The httpd.conf file is also updated to listen to the port 4443 and to assign localhost:4443 as the ServerName, as shown below.
#Listen 80
Listen 4443
# ServerName localhost:80
ServerName localhost:4443
6) Go to the folder of C:\Apache24\bin and follow the instructions in the readme_first.html file that comes with the package of the binaries to install the Apache as a service and to start the Apache by the following commands.
httpd -k install
httpd -k start
7) Once the Apache has started, type in "http://localhost:4443" in the address window of a browser, the browser will display the content stored in C:\Apache24\htdocs folder, as shown below.
8) Navigate to the http://localhost:4443/BrowserPrint.js/Sample/ folder in the browser. You'll see the sample demo as shown below. Now, you can experiment with the sample demo.
2.2. Using Windows IIS (Internet Information Services)
Some people may want to use Windows IIS instead of Apache. Here are the steps to set up a Web Server with Windows IIS.
1) Click on Windows Start button and type in “Turn Windows features on or off” in the search box.
2) Expand the “Internet Information Services” option and enable the “World Wide Web Services” option in the Windows Features window. By default, the “Default Document”, “Directory Browsing”, “HTTP Errors” and “Static Content” options will be enabled.
3) Click on “OK”, as shown below.
4) Click on the Windows Start button and type in “Internet Information Services (IIS) Manager” or just “IIS”.
5) After the “Internet Information Services (IIS) Manager” window pops up, you right click on the Site and select “Add Web Site…” to add a new website. On the popped up dialogue window, type in “MyBrowserPrint” in the Site Name field. In the Physical Path field, navigate to the “C:\Program Files (x86)\Zebra Technologies\Zebra Browser Print\Documentation” folder, which is the folder created by the Browser Print installer by default. Then type in the port number 4444 (as we already used 4443 for Apache).
6) Click on the “OK” button. This new website will start running by default.
7) Now, you'll need to provide the read permission to the IUSR (the default internet user) for the content in “C:\Program Files (x86)\Zebra Technologies\Zebra Browser Print\Documentation” folder. If you forget to give the read permission to IUSR, you would get errors in the sample demo. To give the permission, you simply navigate to “C:\Program Files (x86)\Zebra Technologies\Zebra Browser Print\Documentation” folder and right click on the BrowserPrint.js folder and select the Properties. If the IUSR is not on the user name list, click on “Edit…” button to add IUSR to the list, so that you can give it the read permission. Then, click on "OK" button.
8) Open a browser and type on "http://localhost:4444/BrowserPrint.js/Sample" in the address window. Then you'll see the sample demo up and running in the browser as shown below. Now you can experiment the sample demo with IIS.
As always, any comments and feedback are welcome. Happy coding!
Anonymous (not verified)
2 Replies
Great instructions... I set up the webserver on my PC and got the demo working.
Question, it seems to me that the Zebra Browser Print Server must be installed and running on the same PC as the Webserver. Is this right?
The webserver can be at anywhere on the network as long as it's accessible. Zebra Browser Print has to be installed on the PC that is used to access the webpage hosted on the webserver. So that the Browser Print can do a print (through the browser) onto a printer, which is either directly connected to the PC over USB or remotely connected in the same subnet. In this architecture, the webserver is just a place to host the html and the Browser Print library files.