A simple hapi plugin that serves the favicon.ico route for you. This is the icon that will appear in browser tabs.
npm install hapi-favicon
Just register the plugin with your hapi server:
await server.register({
plugin: require('hapi-favicon'),
options: {
path: '/path/to/standard/icons/standard.ico'
}
});
where path is the local file path to your favicon image. This will register a route with hapi at the standard /favicon.ico route that returns your icon with the image/x-icon mime header type. Leaving path blank will just serve a blank image.
You can tell hapi-favicon to also serve Apple touch icons for Apple-specific devices, in addition to the standard .ico icons:
await server.register({
plugin: require('hapi-favicon'),
options: {
path: '/path/to/standard/icons/standard.ico',
appleTouch: '/path/to/apple/icons/'
}
);
This will register a route at '/apple-touch-icon{size?}.png' that serves the corresponding PNG icon from the /path/to/apple/icons folder. Sizes supported are the Apple-standard dimensions: 57x57, 60x60, 72x72, 76x76, 114x114, 120x120, 144x144, 152x152. If the client requests dimensions other than these standard dimensions, the plugin will default to the next-lowest size. For example if you request /apple-touch-icon65x65.png, you will get the apple-touch-icon60x60.png icon instead.
Setting the appleTouch icon to true instead of a file path will result in the '/apple-touch-icon{size?}.png' route serving an empty image/x-icon for all requested image sizes.
If you want your favicon.ico route to be protected by your hapi auth scheme, you can specify the auth config like so:
await server.register({
plugin: require('hapi-favicon'),
options: {
path: '/path/to/standard/icons/standard.ico',
auth: {
strategy: 'cookie',
mode: 'try'
}
}
);
This only applies to the favicon.ico route, Apple touch icons will be publicly available.