Customising SecuritySpy’s Web Interface

SecuritySpy has a built-in web server that allows remote viewing of live camera streams as well as access to previously-captured footage and settings. We sometimes get asked by customers how to customise the appearance of these web pages for various reasons, such as to change colours, add branding, modify text etc. The procedure is quite simple, though it does require some knowledge of HTML and CCS.

All the files used for SecuritySpy’s web interface are stored within its application bundle. Right-click on the SecuritySpy application icon and select Show Package Contents.

Within the SecuritySpy application bundle, navigate to Contents/Resources/English.lproj/Web/ – all the files SecuritySpy uses for its web interface are stored here.

It’s important that you don’t modify these files directly; instead, for any file that you want to customise, copy it to the ~/SecuritySpy/Web/ folder. To get to this folder, click the Go menu in the Finder, select Home, then navigate into the SecuritySpy folder. (Note: in older versions of SecuritySpy, the location of this folder is ~/Documents/SecuritySpy/Web/).

Then, modify the file in this user location. When SecuritySpy looks for a resource to deliver via the web server, it will first check this user location, and if the file doesn’t exist there, it will use the file from its application bundle web folder.

Here are some of the main files used in the web interface:

  • index.html – the main page that is displayed when opening the web interface
  • live.html – the page that displays the live camera feeds
  • download.html – the page that displays the list of captured footage
  • mainlogo.png – the image that is displayed at the top of the main page

There are settings pages too, but these change from time to time with SecuritySpy software updates, so it’s not recommended that you create your own.

7 thoughts on “Customising SecuritySpy’s Web Interface

  1. Shawn Punga

    Can you give us any assurances that SecSpy is not vulnerable to the new Bash shell exploit on OSX/Unix based systems, Shell Shock? One of the attack vectors is server side scripting, does SecSpy’s web interface use server side scripting?

    1. bensoftware Post author

      Hi Shawn, I can confirm that SecuritySpy is not affected by this Bash bug. The Shellshock bug primarily affects CGI scripts invoked by the Apache web server. SecuritySpy does not use CGI, Bash, or Apache for its web interface, in fact it does not implement server-side scripting at all.

  2. Nunuv Yurbiz

    Mmm, I copied the live.html file into my ~/Documents/SecuritySpy/Web/ folder, made some small changes (like tot he “Live” header (h1), and some random text in the body, but the changes are not being served. I restarted SecuritySpy too (do you have to normally?) and it made no difference.

    1. Ben Software Post author

      Hi Nunuv, sorry, this appears to be a bug, I’ll make sure this is fixed for the next update!

  3. Kirk Bankes

    Hey Ben. I wanted to change the mainlogo graphic, but it looks like the graphic is now differently sized and named icons. Are those icons also overridden by alternates in the user’s SecuritySpy/Web folder?

    1. Ben Software Post author

      Hi Kirk – any file can be overridden by putting an alternative with the same name in the users’s ~/SecuritySpy/Web folder. If you are talking about the logo on the top of the main index.html page, this uses the png files “icon_128x128.png”, “icon_256x256.png”, and “icon_512x512.png”. The “apple-touch-icon” files are used by iOS when you save one of SecuritySpy’s web pages to your home screen as a shortcut.


Leave a Reply

Your email address will not be published. Required fields are marked *