Story Map Shortlist Images (Hosted AGOL) Inaccessible

873
3
Jump to solution
11-03-2017 11:25 AM
WarrenDavison
Occasional Contributor

I recently created a shortlist story map using images that were hosted within my ArcGIS Online Organisation. Since creating the story map a number of the images have become inaccessible and the story map reports that it has issues. When I investigate those issues, I can open the link just fine and the image loads.

My only thought is that the image is larger than recommended for the thumbnail. I will eventually rectify this but it was working fine up until today.

Has anyone run into this before, and how do I fix it? My story map is public and available here: http://arcg.is/55fvv

Thanks,

Warren

0 Kudos
1 Solution

Accepted Solutions
AlisonSizer
New Contributor III

Hi Warren,

Because of the way that images uploaded directly to your ArcGIS Online Organization account are stored, using many of them on a single webpage is unadvisable. You could instead upload them to your specific Shortlist app (this option is found under the "Add" button), or you could upload them to Flickr. In regards to your Shortlist, I do see all the images loading eventually, but it takes a couple minutes, and even after they've loaded, the app is really sluggish.

If you would like a more technical explanation of the problem, read on:

When you upload an image straight to your Organization and not an individual app, its url ends with /data. This url isn't actually where the image lives. Rather, if you enter it into your browser address bar, it redirects to the actual image address. You can see this happening if you watch your address bar.

For example:

http://www.arcgis.com/sharing/rest/content/items/f8fb52ac3e7e4c96a832a3161b7ffa29/data 

redirects to:

https://ago-item-storage.s3-external-1.amazonaws.com/f8fb52ac3e7e4c96a832a3161b7ffa29/image_paysdaix... 

This second link, ending in .jpg, is where the image actually lives. If you try to go to it directly from the link above, you'll get an "Access Denied" message. If you go through the /data url above, a one-time access token gets attached to the .jpg url, allowing you to see the image. 

One or two of these redirected images on a page works OK, but trying to load more than about three of them at once slows down the page load enormously, and sometimes crashes the page (or the browser) entirely. As with most Story Maps, your Shortlist has 50+ images including thumbnails, so loading them all on a single page will be really problematic. 

Here's a sample outside of Story Maps with just 10 of these redirecting images on the page. Notice how slowly they load. Try selecting the text below the images and notice how sluggish that interaction is. Sometimes the page will freeze for a bit, and sometimes you can even hear your computer's fan kick into overdrive while the page loads -- another sign the page is having troubles.

(If that link above doesn't work, try this: https://jsbin.com/qozikon/edit?html,output ) 

In conclusion, there are other ways to include your photos in your Shortlist app than uploading them to your Organizational account. Consider uploading them within the app or hosting them on Flickr. 

(edit: The sluggishness of redirected images is greatly increased by the file size of the images. The app above had images that were very large. While we do not recommend using images uploaded directly to your ArcGIS Online Organization account, if you must do that we'd suggest resizing them so their file sizes are all under 100kb). 

View solution in original post

3 Replies
AlisonSizer
New Contributor III

Hi Warren,

Because of the way that images uploaded directly to your ArcGIS Online Organization account are stored, using many of them on a single webpage is unadvisable. You could instead upload them to your specific Shortlist app (this option is found under the "Add" button), or you could upload them to Flickr. In regards to your Shortlist, I do see all the images loading eventually, but it takes a couple minutes, and even after they've loaded, the app is really sluggish.

If you would like a more technical explanation of the problem, read on:

When you upload an image straight to your Organization and not an individual app, its url ends with /data. This url isn't actually where the image lives. Rather, if you enter it into your browser address bar, it redirects to the actual image address. You can see this happening if you watch your address bar.

For example:

http://www.arcgis.com/sharing/rest/content/items/f8fb52ac3e7e4c96a832a3161b7ffa29/data 

redirects to:

https://ago-item-storage.s3-external-1.amazonaws.com/f8fb52ac3e7e4c96a832a3161b7ffa29/image_paysdaix... 

This second link, ending in .jpg, is where the image actually lives. If you try to go to it directly from the link above, you'll get an "Access Denied" message. If you go through the /data url above, a one-time access token gets attached to the .jpg url, allowing you to see the image. 

One or two of these redirected images on a page works OK, but trying to load more than about three of them at once slows down the page load enormously, and sometimes crashes the page (or the browser) entirely. As with most Story Maps, your Shortlist has 50+ images including thumbnails, so loading them all on a single page will be really problematic. 

Here's a sample outside of Story Maps with just 10 of these redirecting images on the page. Notice how slowly they load. Try selecting the text below the images and notice how sluggish that interaction is. Sometimes the page will freeze for a bit, and sometimes you can even hear your computer's fan kick into overdrive while the page loads -- another sign the page is having troubles.

(If that link above doesn't work, try this: https://jsbin.com/qozikon/edit?html,output ) 

In conclusion, there are other ways to include your photos in your Shortlist app than uploading them to your Organizational account. Consider uploading them within the app or hosting them on Flickr. 

(edit: The sluggishness of redirected images is greatly increased by the file size of the images. The app above had images that were very large. While we do not recommend using images uploaded directly to your ArcGIS Online Organization account, if you must do that we'd suggest resizing them so their file sizes are all under 100kb). 

WarrenDavison
Occasional Contributor

Hi Alison,

Thanks for the explaination, it really clears things up. I'll relocate the images I'm using to my own web server and use them there for the time being.

Warren

0 Kudos
RupertEssinger
Frequent Contributor

Hi Warren

Relocating those images to your own server is a good solution for these images. This also enables you to reference them via a URL in any other story maps you created. Like Alison says above, bear in mind that when you reference images via a URL in any story map, those images are not optimized like they would be if you uploaded them directly into the Story Map Builder, or into a photo sharing site like Flickr. I noticed that some of your images are quite large, over 2 MB in some cases, and these will load slowly for your readers. Try clearing your browser cache and then reloading your Shortlist to preview the load speed when people click on a place. It may be worth making smaller file-size versions of your images on your server to improve draw speed. See this FAQ for details: Frequently Asked Questions | Story Maps 

Rupert

0 Kudos