Как установить custom favicon в Express?

недавно я начал работать в Node.JS и в приложении.JS файл есть такая строка:

app.use(express.favicon());

теперь, как мне настроить свой собственный favicon.ico?

113
express favicon javascript node.js

9 ответов

В Express 4

установить favicon middleware а потом делать:

var favicon = require('serve-favicon');

app.use(favicon(__dirname + '/public/images/favicon.ico'));

или лучше, используя path модуль:

app.use(favicon(path.join(__dirname,'public','images','favicon.ico')));

(обратите внимание, что это решение будет работать и в приложениях express 3)

В Express 3

согласно API,.favicon принимает параметр местоположение:

app.use(express.favicon("public/images/favicon.ico"));

большую часть времени вам может понадобиться это (как vsync предлагается):

app.use(express.favicon(__dirname + '/public/images/favicon.ico'));

или еще лучше, используйте path модуль (как предложил Друска):

app.use(express.favicon(path.join(__dirname, 'public','images','favicon.ico')));
200

без дополнительной middlewares требуется. Просто используйте:

app.use('/favicon.ico', express.static('images/favicon.ico'));
23

смайлик favicon для предотвращения ошибки:

 //const fs = require('fs'); 
 //const favicon = fs.readFileSync(__dirname+'/public/favicon.ico'); // read file
 const favicon = new Buffer('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);
 });

изменить значок в коде выше

сделайте значок, возможно, здесь:http://www.favicon.cc/ или здесь:http://favicon-generator.org

преобразовать его в base64 может быть здесь:http://base64converter.com/

затем замените значок base 64 value

Общая информация как создать персонализированный fav икона

иконки сделаны с помощью photoshop или inkscape, возможно inkscape затем photoshop для вибрации и цветокоррекции (в меню image->adjustments).

для быстрого значка goto http://www.clker.com/ и выберите некоторые векторные клипарты и загрузите как svg. затем принесите его в inkscape (https://inkscape.org/) и изменить цвета или удалить детали, возможно, добавить что-то из другого векторного изображения клипарта, а затем экспортировать выберите детали для экспорта и нажмите Файл>Экспорт, выберите размер, как 16x16 для favicon или 32x32. для дальнейшего редактирования 128х128 или разрешением 256x256. пакет ico может иметь несколько размеров значков внутри. он может иметь вместе с 16x16 pixel favicon высококачественные значки для ссылки на веб-сайт.

затем, возможно, улучшить изображение в photoshop. как вибрация, эффект скоса, круглая Маска, что угодно.

затем загрузите это изображение на один из веб-сайтов, которые генерируют фавиконы. есть также программы для windows Для редактирования значков, таких как https://sourceforge.net/projects/variicons/ .

чтобы добавить favicon на сайт. просто поставь фавикон.ico как файл в корневой папке домена. например в узел.js в общей папке, содержащей статические файлы. это не должно быть что-то особенное, как код выше простого файла.

12
app.use(express.favicon(__dirname + '/public/images/favicon.ico'));

у меня он работал локально без __dirname + но не смог заставить его работать на моем развернутом сервере.

8

нет необходимости в пользовательском промежуточном по?! В express:

 //you probably have something like this already    
app.use("/public", express.static('public'));

затем поместите свой favicon публично и добавьте следующую строку в голову вашего html:

<link rel="icon" href="/public/favicon.ico">
7

Если вы используете Express > 4.0, вы можете пойти на служить-favicon

5

Если у вас установлен статический путь, просто используйте <link rel="icon" href="/images/favicon.ico" type="image/x-icon"> в ваши взгляды. Больше ничего не нужно. Убедитесь, что папка изображений находится в общей папке.

3

код, указанный ниже, работает:

var favicon = require('serve-favicon');

app.use(favicon(__dirname + '/public/images/favicon.ico'));

просто не забудьте обновить браузер или очистить кэш.

-1

Шаг 0: добавьте ниже код в приложение.js или индекс.js

app.use("/favicon.ico", express.static('public/favicon.ico'));

Шаг 1: Загрузите значок отсюда https://icons8.com/ или создайте свой собственный
Шаг 2: Перейдите кhttps://www.favicongenerator.com/
Шаг 3: загрузите скачанный икона.png файл > установить 16px > создать favicon > скачать
Шаг 4: перейдите в папку загрузки, вы найдете [.ICO file], переименуйте его в favicon.ico
Шаг 5: скопируйте favicon.ico в общедоступном каталоге вы создано
Шаг 6: добавьте код ниже к вашему.файл мопса под тегом head, ниже тега заголовка 

<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">

Шаг 7: сохранить > перезапустить сервер > закрыть браузер > открыть браузер > появится favicon

Примечание: Вы можете использовать имя, отличное от favicon,
но убедитесь, что вы изменили имя в коде и в общей папке.

-1