[javascript] Express에서 사용자 정의 파비콘을 설정하는 방법은 무엇입니까?

나는 최근 Node.js에서 작업을 시작했으며 app.js 파일에는 다음 줄이 있습니다.

app.use(express.favicon());

이제 나만의 favicon.ico를 어떻게 설정합니까?



답변

Express 4에서

파비콘 미들웨어를 설치 한 후 다음을 수행하십시오.

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'));

또는 pathDruska가 제안한대로 모듈을 사용하십시오 .

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

파비콘정적 인 것보다 좋은 이유

패키지 설명 에 따르면 :

  1. 이 모듈은 디스크 액세스를 건너 뛰어 성능을 향상시키기 위해 아이콘을 메모리에 캐시합니다.
  2. 이 모듈은 ETag파일 시스템 특성이 아니라 아이콘의 내용을 기반으로합니다.
  3. 이 모듈은 가장 호환되는 기능을 Content-Type합니다.

답변

추가 미들웨어가 필요하지 않습니다. 그냥 사용하십시오 :

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


답변

오류를 방지하기 위해 웃는 favicon :

 //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);
 });

위의 코드에서 아이콘을 변경하려면

아이콘을 여기에 만드십시오 : http://www.favicon.cc/ 또는 여기 : http://favicon-generator.org

아마 여기를 base64로 변환하십시오 : http://base64converter.com/

그런 다음 아이콘 기준 64 값을 바꿉니다.

개인화 된 즐겨 찾기 아이콘을 작성하는 방법에 대한 일반 정보

아이콘은 포토샵이나 잉크 스케이프를 사용하여 만들어지며, 잉크 스케이프 후 포토샵을 사용하여 생동감과 색상 보정을합니다 (이미지-> 조정 메뉴).

빠른 아이콘을 보려면 http://www.clker.com/으로 이동 하여 Vector Clip Arts를 선택하고 svg로 다운로드하십시오. 그런 다음 inkscape ( https://inkscape.org/ ) 로 가져 와서 색상을 변경하거나 부품을 삭제하고 다른 벡터 클립 아트 이미지에서 무언가를 추가 한 다음 내보낼 부품을 선택하고 내보낼 파일> 내보내기를 클릭하십시오. 파비콘 또는 32×32. 128×128 또는 256×256을 추가로 편집 할 수 있습니다. ico 패키지는 여러 개의 아이콘 크기를 가질 수 있습니다. 16×16 픽셀 파비콘과 함께 웹 사이트 링크를위한 고품질 아이콘을 가질 수 있습니다.

포토샵에서 이미지를 향상시킬 수 있습니다. 생동감, 경사 효과, 둥근 마스크 등.

그런 다음 즐겨 찾기 아이콘을 생성하는 웹 사이트 중 하나에이 이미지를 업로드하십시오. https://sourceforge.net/projects/variicons/ 와 같은 아이콘 편집을위한 창 프로그램도 있습니다 .

파비콘을 웹 사이트에 추가합니다. favicon.ico를 도메인의 루트 폴더에 파일로 저장하십시오. 예를 들어 정적 파일이 들어있는 공용 폴더의 node.js에 있습니다. 단순한 파일 위의 코드와 같이 특별한 것이 될 필요는 없습니다.


답변

사용자 정의 미들웨어가 필요하지 않습니까?! 명시 적으로 :

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

그런 다음 즐겨 찾기 아이콘을 공개로 설정하고 HTML 헤드에 다음 줄을 추가하십시오.

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


답변

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

없이 로컬에서 작동 __dirname +했지만 배포 된 서버에서 작동하지 못했습니다.


답변

Express> 4.0을 사용하는 경우 serve-favicon사용할 수 있습니다.


답변

고정 경로를 설정 <link rel="icon" href="https://stackoverflow.com/images/favicon.ico" type="image/x-icon">했다면 뷰에서를 사용하십시오 . 다른 것은 필요 없습니다. 공용 폴더 안에 이미지 폴더가 있는지 확인하십시오.