How to serve both dynamic and static pages with Dart and shelf?

Question

Using shelf_static to serve static web pages through Dart is no problem:

var staticHandler = createStatic         


        

Answer 1

The reason is that the shelf_route methods like get must fully match the path. With static files you don't want exact matches as the remainder of the path tells you the path to the file.

For this you need to use the add method and set exactMatch: false as currently the methods like get, post etc don't expose exactMatch.

The following works

void main(List args) {

  Logger.root.onRecord.listen(print);

  var staticHandler = createStaticHandler('../static', defaultDocument:'home.html');

  final root = router()
    ..get('/item/{itemid}', (Request request) => 'handling the item')
    ..add('/', ['GET'], staticHandler, exactMatch: false);

  printRoutes(root);

  io.serve(root.handler, InternetAddress.ANY_IP_V6, 9999);

}

FYI I've added a higher level framework called mojito that is a thin glue layer on many of the shelf components that makes this a little easier.

It's still kinda newish and poorly documented but in case you're interested you can do the following

void main(List args) {

  Logger.root.onRecord.listen(print);

  final app = mojito.init();

  app.router
    ..get('/item/{itemid}', (String itemid) => 'handling the item $itemid')
    ..addStaticAssetHandler('/', fileSystemPath: '../static', 
        defaultDocument:'home.html');

  app.start();
}

addStaticAssetHandler calls createStaticHandler behind the scenes but also supports invoking pub serve in development mode which is very handy for stuff like polymer