How to set custom favicon in Express?

前端 未结 14 1906
星月不相逢
星月不相逢 2020-12-12 12:49

I recently started working in Node.js and in the app.js file there is this line:

app.use(express.favicon());

Now, how do I set up my own cu

14条回答
  •  鱼传尺愫
    2020-12-12 12:57

    smiley favicon to prevent error:

     //const fs = require('fs'); 
     //const favicon = fs.readFileSync(__dirname+'/public/favicon.ico'); // read file
     const favicon = new Buffer.from('AAABAAEAEBAQAAAAAAAoAQAAFgAAACgAAAAQAAAAIAAAAAEABAAAAAAAgAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAA/4QAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEREQAAAAAAEAAAEAAAAAEAAAABAAAAEAAAAAAQAAAQAAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAEAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD//wAA//8AAP//AAD8HwAA++8AAPf3AADv+wAA7/sAAP//AAD//wAA+98AAP//AAD//wAA//8AAP//AAD//wAA', 'base64'); 
     app.get("/favicon.ico", function(req, res) {
      res.statusCode = 200;
      res.setHeader('Content-Length', favicon.length);
      res.setHeader('Content-Type', 'image/x-icon');
      res.setHeader("Cache-Control", "public, max-age=2592000");                // expiers after a month
      res.setHeader("Expires", new Date(Date.now() + 2592000000).toUTCString());
      res.end(favicon);
     });
    

    to change icon in code above

    make an icon maybe here: http://www.favicon.cc/ or here :http://favicon-generator.org

    convert it to base64 maybe here: http://base64converter.com/

    then replace the icon base 64 value

    general information how to create a personalized fav icon

    icons are made using photoshop or inkscape, maybe inkscape then photoshop for vibrance and color correction (in image->adjustments menu).

    for quick icon goto http://www.clker.com/ and pick some Vector Clip Arts, and download as svg. then bring it to inkscape (https://inkscape.org/) and change colors or delete parts, maybe add something from another vector clipart image, then to export select the parts to export and click file>export, pick size like 16x16 for favicon or 32x32. for further edit 128x128 or 256x256. ico package can have several icon sizes inside. it can have along with 16x16 pixel favicon a high quality icons for link for the website.

    then maybe enhance the image in photoshop. like vibrance, bevel effect, round mask, anything.

    then upload this image to one of the websites that generate favicons. there are also programs for windows for editing icons like https://sourceforge.net/projects/variicons/ .

    to add the favicon to website. just put the favicon.ico as a file in the root folder of the domain. for example in node.js in public folder that contains the static files. it doesn't have to be anything special like code above just a simple file.

提交回复
热议问题