2014-02-01 2 views
0

Я пытаюсь хранить и извлекать изображения из MongoDB (Gridfs) и отображать изображение с помощью HTML.Сохранение и получение изображения из MongoDB (GridFs) и отображение в Html с помощью vb.net webservice

Я сохранил изображение и получил идентификатор изображения, передав идентификатор на HTML-страницу с помощью Ajax, он принимает идентификатор изображения, но изображение не отображается. Может кто-нибудь мне направить.

Вот мой код:

HTML код:

<html> 
<head> 
</head> 
    function display() { 
     $.ajax({ 
      type: 'POST', 
      url: 'xidirectorywebservice.asmx/UploadImage', 

     data: "{ }", 

      contentType: 'application/json; charset=utf-8', 
      dataType: 'json', 
      success: function (image_string) 
      { 
      var data = 'data:image/png;base64,' + image_string.d; 
       var icon_elem = document.getElementById("ItemPreview"); //adding img id 
       icon_elem.src = data; 
      $(document.body).append(image_string.d); 
      }, 
      error: function() { 
       alert("Error"); 
      } 

     }); 

     } 

    </script> 

</head> 
<body onload="display()"> 
<img id="ItemPreview" src="" /> 
</body> 
</html> 

vb.net (Webservice) Код:

XIImage класс:

Imports MongoDB.Bson 
Public Class XIImage 

Public Property _id As ObjectId 
Public Property name As String = "" 
Public Property title As String = "" 
Public Property image As Byte() 
Public Property ImageId() As ObjectId 
End Class 

Код:

Public Function UploadImage() As String 
    Dim server As MongoServer = MongoServer.Create("mongodb://localhost") 
    Dim db As MongoDatabase = server("imagedemo") 

    Dim collection As MongoCollection = db("demo") 

    Dim imageBook As New XIImage 
    imageBook._id = New ObjectId() 
    imageBook.name = "Tom Sawyer" 
    imageBook.title = "Content of the book goes here" 
    imageBook.image = file.ReadAllBytes("C:\Users\Prog23\Desktop\wallpapers-41.jpg") 

    Dim memoryStream As Stream = New MemoryStream(imageBook.image) 
    Dim gfsi As MongoGridFSFileInfo = db.GridFS.Upload(memoryStream, imageBook.name) 
    imageBook.ImageId = gfsi.Id.AsObjectId 
    collection.Insert(imageBook) 
    Dim id As New ObjectId(imageBook.ImageId.ToString()) 
    Dim sfile As MongoGridFSFileInfo = db.GridFS.FindOne(Query.EQ("_id", id) 

    Using stream = sfile.OpenRead() 
     Dim sid = sfile.Id 
     MsgBox(sid.ToString()) 
    End Using 
    End Function 

Но когда я запрашиваю в приглашении оболочки, я могу видеть двоичный формат изображения. Любая помощь будет оценена. ура.

ответ

1

Ваш код только получение _id из загруженного изображения, а не содержание. Вам нужен контент. Я нашел ссылку уже на Stack overflow, чтобы сэкономить на некоторых вводах. Код C#, но все классы такие же, как и один и тот же драйвер.

Быстрое заявление об отказе от ответственности, если можно. Если ваши файлы не огромны (> 16 МБ [закодировано]), и я предполагаю, что это не так, GridFS может не быть вашим лучшим вариантом. Вы, скорее всего, найдете больше радости и меньше прыгаете через обручи, если вы просто кодируете загруженный файл в качестве base64 и вставляете его как поле так же, как и с любым обычным документом MongoDB. Таким образом, вам будет легче справиться.

GridFS не является магии, это, по сути, просто клиентская реализация, выполняющая именно этот предыдущий шаг, но имеющая дело с данными в интеллектуальных кусках, чтобы преодолеть ограничение на 16 МБ в документе BSON. Подробнее по ссылкам:

http://docs.mongodb.org/manual/core/gridfs/

http://docs.mongodb.org/manual/faq/developers/#faq-developers-when-to-use-gridfs

Это говорит, с ней: Так в основном вы хотите читать из потока вернулся из .OpenRead() на возвращенном объекте и кодировать вывод с кодировкой base64.

В качестве альтернативного подхода к выравниванию изображения таким образом вы можете передать двоичные данные в ответ от другого контроллера, отвечающего на изображения, определенным идентификатором или именем. Ваша загрузка ajax тогда должна только вернуть url к изображению (конечная точка контроллера с идентификатором изображения), и это будет стандартным атрибутом img src.

Также полезно включить некоторые магии для обнаружения типа MIME, а не жесткого кода, что в вашем скрипте.

+0

Спасибо за ответ. Это сработало для меня, проблема была в преобразовании байтов в Base64, поскольку я хотел передать значение html, чтобы отобразить его, а не создавая образ с другим именем. Вместо этого я использовал это для преобразования и передачи значения в Ajax: base64String = System.Convert.ToBase64String (bytes, 0, bytes.Length) – pavan

1

это решение для этого:

Display image from binary data in html

пишут так:

<img src="data:image/jpeg;base64{binary data}" /> 
+0

Я использовал это в HTML для преобразования формата Base64 в источник изображения. – pavan

Смежные вопросы