1

I have a bare-metal application running on a tiny 16 bit microcontroller (St10) with 10BASE-T Ethernet (CS8900) and a Tcp/IP implementation based upon the EasyWeb project.

There is a tiny webserver implemented for displaying some status information of the device and also allows to change settings et cetera.

For browser access, the webserver provides some files like index.html, *.css, *.js, *.svg, *.png and so on.

As the bare-metal target has no storage media like a sd-card, I put all of the above mentioned resources into the compiled binary.

For saving memory and reducing traffic, I put all of the files together into a single index.html compress that using gzip and let my webserver deliver this using Content-Encoding: gzip.

The step to put all the files together into single index.htm is currently manual work (incl. replace filename references et cetera). Might there be a tool which do this automatically?

Or alternatively, can I just zip / tar / whatever all the files into a single file and deliver this upon http GET / request?

Edit 2017-10-05

Solved by using the inliner mentioned by brain99.

Having small trouble making it run on Kubuntu 16.04 host but finally fixed it by installing:

sudo apt-get install nodejs
sudo ln -sT "$(which nodejs)" /usr/local/bin/node
sudo apt-get install npm
sudo npm install -g inliner

Maybe, I'd got rid of the symlink by using nodejs-legacy instead of nodejs (have not tried). After having installed that, I just need to run:

inliner index.html >index-backed.html
gzip -c index-backed.html >index.html.gz
Joe
  • 3,090
  • 6
  • 37
  • 55
  • works for you a single [go](https://golang.org) binary being the web server and also containing your static content? – nbari Oct 03 '17 at 14:31
  • Hmm, I'd already have a http server implementation incl. user management, digest access authentication, session management, dynamic content generation (e.g. device state as yaml) et cetera. The go approach sounds like a widely renewing of all of them, isn't it? – Joe Oct 03 '17 at 16:12
  • Yes so maybe not what you are looking for since like you proper mention it will imply redoing everything. – nbari Oct 03 '17 at 17:47

2 Answers2

3

Option 1: via Chrome

There is a set of two Chrome extensions that allow you to save a webpage to a single HTML file:

The second extension is a helper extension required by the first one. I did not test this, but it seems to have reasonably good reviews in the Chrome web store (apparently it can choke on complex pages).

With these extensions, you should just be able to open the page in Chrome and use the extensions to save as a single file with embedded CSS/scripts/images.

Option 2: scriptable

If you want to automate things in a script, there is also a project on github exactly for that, which can be installed via npm.

brain99
  • 883
  • 5
  • 15
  • Sounds nice. Do you know if there is also a command line interface so that I'm able to integrate that into my development toolchain? – Joe Oct 01 '17 at 12:58
  • 1
    The [inliner](https://github.com/remy/inliner) perfectly matches my needs! – Joe Oct 05 '17 at 12:18
0

I am a little confused on what you want to do but I am guessing you need a way to save some storage, one thing that you could maybe try in storing some files in Google Drive? That way, you don't have to worry about the files on there, you just upload your images, and pull them from drive like this:

<img src="https://drive.google.com/uc?export=download&id=YOUR_FILE_ID">

Of course replace YOUR_FILE_ID with your actual file ID, get that by using the share link for Google Drive. Like this:

https://drive.google.com/file/d/YOUR_FILE_ID/view?usp=sharing

I would find this a better solution than zipping it, but the choice is yours, hope this helps you!

HoogleyBoogley
  • 340
  • 2
  • 14
  • My devices have not all internet connection. In some cases there is only my bare-metal device and a PC / notebook connected via e.g. ethernet. – Joe Oct 01 '17 at 13:01