MongoDb에 저장된 이미지 표시

Question

나는 아주 좋아하는 응용 프로그램이 있습니다. 이미지 및 기타 관련 정보는 MongoDb에 저장됩니다. 일반적으로 이미지의 크기는 약 1MB입니다. 이미지가 무한 스크롤로 표시됩니다. base64 문자열을 사용하는 긴 스크립트가로드되면 브라우저가 충돌하거나 응답 시간이 매우 길어집니다 (특히 Internet Explorer의 경우) MongoDb에 저장된 이미지를 표시하는 가장 좋은 방법은 무엇입니까?

Answer 1

이 응용 프로그램의 일부 서버 쪽이 있습니까? 이미지를 검색 할 수있는 작은 API를 만들면 어떨까요?

그래서 브라우저가 이미지에 대한 정보를 가질 것이며, 그것을 위해 라인에 뭔가를 서버를 요청할 수 있습니다 http://your_server/api/image/imageID 또는 http://your_server/images/imagename 다음 그냥이 이미지를 스트리밍 할 서버, 당신은 파일 시스템이 저장 할 필요가 없습니다.

클라이언트 측 (브라우저)에서 '지연로드'만 구현하면됩니다.

Answer 2

나는 이것을 달성하는 가장 좋은 방법은 실제로 서버의 일부 공용 폴더에 파일을 보관하는 것입니다. 이것은 당신은 당신은 여전히 ​​백업으로하여 MongoDB에서 Base64로 이미지를 유지할 수

http://www.myhost.com/images/my/path/to/image.jpg

같은 것을 사용할 필요가있는 방법으로 accesible해야하지만,이에 가장 좋은 방법이 아니다 성능 문제로 인해 이미지를 검색 할 수 있습니다 (본 것처럼). 다음을 수행 할 것을 권합니다.

mongo에 이미지를 저장할 때마다 "이미지 파일"을 서버의 일부 공공 장소에도 저장해야합니다. 사용중인 몽고 모델에 해당 파일의 경로를 유지해야한다는 것을 명심하십시오. 따라서 다음 번에 객체를 호출 할 때 기본 64 이미지를 얻는 대신 이미지 경로 만 가져야합니다.

방금 ​​몽고 투영을 사용하여 image64을 무시 할 수 있으며, 클라이언트 측에서 그냥 사용합니다 일부 HTML 태그를 사용하여이 모델

myModel = { 
    name: "some name", 
    image64: "someextralongstringveryveryveryweird......", 
    imageUrl: "/images/my/path/to/image/imagename-id.jpg" 
} 

당신이 그것에 쿼리 다음 시간을 말할 수 있습니다 그 url.

<img src="/images/my/path/to/image/imagename-id.jpg"> 

성능에 많은 도움이됩니다.

이미지 파일 생성을 관리하는 데 도움이되는 라이브러리가 있습니다. ImageMagick은 내가 사용 해왔고 매우 다양합니다.

Answer 3

MongoDB를 사용하는 경우 GridFS (http://excellencenodejsblog.com/gridfs-using-mongoose-nodejs/)를 사용하여 데이터베이스에 이미지를 저장해야합니다.이 기능은 응용 프로그램에 가상 파일 시스템과 같은 것을 제공합니다.

GridFS를 사용하면 MongoDB 인스턴스에서 요청한 파일을 스트리밍하고 파일 내용을 응답에 파이프하는 컨트롤러 메소드를 작성할 수 있습니다.

Answer 4

이미지를 파일 시스템에 저장하고 웹 서버를 사용하여 클라이언트에 제공하는 것이 좋습니다. 성능 향상을 위해 트래픽을 처리 할 수있는 CDN에 넣을 것입니다.

응용 프로그램 저장소 (mongo)에서 URL/위치를 이미지에 저장 한 다음 자바 스크립트 코드에서 이미지를 검색 할 때 사용할 수 있습니다.

또한 코드에서 사용자가 스크롤하기 전에 이미지를 미리로드하는 자바 스크립트를 통해 이미지를 미리로드하는 것이 좋습니다. 거기에 당신이 활용할 수있는 몇 가지 훌륭한 도구가 있습니다.

저장 용량을 변경할 수없는 상황에서 mongo를 사용해야합니다. 미리보기 이미지는 javacript입니다.