Changing website favicon dynamically

Question

I have a web application that\'s branded according to the user that\'s currently logged in. I\'d like to change the favicon of the page to be the logo of the private label,

Answer 1

I would use Greg's approach and make a custom handler for favicon.ico Here is a (simplified) handler that works:

using System;
using System.IO;
using System.Web;

namespace FaviconOverrider
{
    public class IcoHandler : IHttpHandler
    {
    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "image/x-icon";
        byte[] imageData = imageToByteArray(context.Server.MapPath("/ear.ico"));
        context.Response.BinaryWrite(imageData);
    }

    public bool IsReusable
    {
        get { return true; }
    }

    public byte[] imageToByteArray(string imagePath)
    {
        byte[] imageByteArray;
        using (FileStream fs = new FileStream(imagePath, FileMode.Open, FileAccess.Read))
        {
        imageByteArray = new byte[fs.Length];
        fs.Read(imageByteArray, 0, imageByteArray.Length);
        }

        return imageByteArray;
    }
    }
}

Then you can use that handler in the httpHandlers section of the web config in IIS6 or use the 'Handler Mappings' feature in IIS7.

Answer 2

Yes totally possible

• Use a querystring after the favicon.ico (and other files links - see answer link below)
• Simply make sure the server responds to the "someUserId" with the correct image file (that could be static routing rules, or dynamic server side code).

e.g.

<link rel="shortcut icon" href="/favicon.ico?userId=someUserId">

Then whatever server side language / framework you use should easily be able to find the file based on the userId and serve it up in response to that request.

But to do favicons properly (its actually a really complex subject) please see the answer here https://stackoverflow.com/a/45301651/661584

A lot lot easier than working out all the details yourself.

Enjoy.

Answer 3

I use favico.js in my projects.

It allows to change the favicon to a range of predefined shapes and also custom ones.

Internally it uses canvas for rendering and base64 data URL for icon encoding.

The library also has nice features: icon badges and animations; purportedly, you can even stream the webcam video into the icon :)