Uploaded image for project: 'Help-Desk'
  1. Help-Desk
  2. HELP-4648

FIWARE.Question.Tech.Apps.ApplicationMashup.ComponentDevelopment.ObjectStorageIMG

    Details

      Description

      Created question in FIWARE Q/A platform on 18-08-2015 at 11:08
      Please, ANSWER this question AT http://stackoverflow.com/questions/32069097/referencing-images-stored-in-object-storage-containers-wirecloud-from-img-tag

      Question:
      Referencing images stored in object storage containers (Wirecloud) from img tag

      Description:
      We want to develop a widget to upload images to containers. This is a very well documented task:

      1.- Object Storage Tutorial

      2.- Fireware-Wiki

      3.- OpenStack Object Storage Docs (Swift)

      With all this you can manage to get (download), upload, delete files in a container. This is relatively clear.

      On the other hand, we want to develop another widget to display images stored in a container. I think in something like this to show them:

      <img src="public_object_url"/>

      But I do not know how to do that. Where I get this public URL? Is there a public URL? Is it get in some step during the uploading process?

      I am a bit lost how to do that. Any help would be highly appreciated.

      Thanks in advance.

      EDIT 1

      We get blocked displaying images once they are downloaded.

      A look inside "img" tags shows this:

      what is the string returned by URL.createObjectURL(). If we look inside this link, the browser displays this:

      We have decoded the string coming in the property "value" and the image is there!

      To get the image from the object storage server we used a very similar code that the one used in the operator Álvaro recommended.

      objectstorage.getFile( containerName,
      reports[i].urlImagen,

      { token: token, onSuccess: onGetFileSuccess.bind(null, i), onFailure: onGetFileFailure }

      );

      function onGetFileSuccess(index, picture){
      downloadedPicsCont--;
      reports[index].urlImagen = URL.createObjectURL(picture);
      if(!(downloadedPicsCont > 0)){
      MashupPlatform.wiring.pushEvent('reports_output', JSON.stringify(reports));
      }

      }

      The picture variable has the following structure, which seems to be ok too.

      What is it happening?

      EDIT 2

      Finally, we found the reason. We were downloading images that were created directly from the cloud and not with objectStorageAPI. In you upload images from the cloud, when you download them you get them inside cdmi objects so the URL.createObjectURL doesn't not work as expected. In the other hand, if you upload them using objectStorageAPI, when downloading them, they come in raw format, so the method works correctly.

        Activity

        Hide
        backlogmanager Backlog Manager added a comment -

        2015-10-05 00:05|CREATED monitor | # answers= 1, accepted answer= True

        Show
        backlogmanager Backlog Manager added a comment - 2015-10-05 00:05|CREATED monitor | # answers= 1, accepted answer= True
        Hide
        backlogmanager Backlog Manager added a comment -

        2015-10-05 03:05|UPDATED status: transition Answer| # answers= 1, accepted answer= True

        Show
        backlogmanager Backlog Manager added a comment - 2015-10-05 03:05|UPDATED status: transition Answer| # answers= 1, accepted answer= True
        Hide
        backlogmanager Backlog Manager added a comment -

        2015-10-05 06:05|UPDATED status: transition Answered| # answers= 1, accepted answer= True

        Show
        backlogmanager Backlog Manager added a comment - 2015-10-05 06:05|UPDATED status: transition Answered| # answers= 1, accepted answer= True
        Hide
        backlogmanager Backlog Manager added a comment -

        2015-10-14 03:05|UPDATED status: transition Finish| # answers= 1, accepted answer= True

        Show
        backlogmanager Backlog Manager added a comment - 2015-10-14 03:05|UPDATED status: transition Finish| # answers= 1, accepted answer= True

          People

          • Assignee:
            aarranz Álvaro Arranz
            Reporter:
            backlogmanager Backlog Manager
          • Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved: