'How to view an image stored in Google cloud storage bucket?

I have a bucket that has images stored in it , when I retrieve the image using the public URL of the image it downloads it in the browser instead of showing the image in the browser , how can I view the image instead of downloading it. I use the following URL for the uploaded image.

https://www.googleapis.com/download/storage/v1/b/image-downloader-bucket/o/a06266f6-6082-468e-92ca-f918a48533a8?generation=1455661996337000&alt=media

Can someone let me know how to create the right URL for viewing the image ?



Solution 1:[1]

My problem was that I wasn't setting the mimetype for the object. Without it, the browser didn't know it was an image, so it was downloading the file instead of displaying it in the browser window

Adding this did the trick:

const blobStream = blob.createWriteStream({
  metadata: {
    contentType: "image/jpeg"
  }
});

Solution 2:[2]

Similar to the @ehero response but for python, the point is using content_type blob attribute before uploading the file:

from google.cloud import storage
storage_client = storage.Client.from_service_account_json('your/path/to/service/credentials.json')
bucket = storage_client.bucket('my-bucket-name')
blob = bucket.blob('my/path/in/storage.jpg')
blob.content_type = 'image/jpeg' # This one is the important
blob.upload_from_file(file) # Also available upload_from_filename

Solution 3:[3]

Yes there is! You actually resize the image of your file stored in Google Cloud Storage thru the Images API. Have a look at this link:

https://cloud.google.com/appengine/docs/java/images/

Solution 4:[4]

  • Go to Google cloud console-> Storage->Browser https://console.cloud.google.com/storage/browser
  • Click on your bucket
  • You can select an image/file in bucket and edit access by clicking on the 3 dots option and make it public.
  • It will generate public URL

See for details: make data public

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Eric
Solution 2 vperezb
Solution 3 Keiji
Solution 4 Mundroid