You are not logged in.

Dear visitor, welcome to krpano.com Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

jordi

Intermediate

  • "jordi" started this thread

Posts: 464

Location: Barcelona

Occupation: creating ideas & coding them

  • Send private message

1

Friday, October 6th 2017, 3:57pm

iOS issue with CORS using amazon S3

Hi, I'm having trouble using an Amazon S3 bucket, when I'm viewing the project from iOS device, not all images are loaded, panos are always loaded, but rest of the images are not, like thumbs, ... is anyone knowing how to solve this, I guess it was about the policy of CORS, but I already did try different settings without success, on android devices it's working like a charm... Thanks in advance
everpano.com step beyond 360

2

Friday, October 6th 2017, 8:08pm

Hi,

iOS has an caching bug related to CORS requests in some cases.

The layer and css3d-hotspot images that will be sown on the screen are loaded by the browser by its own (as css-background image) - and that will be done by the browser always WITHOUT a 'crossOrigin' setting - while the krpano js-script needs to load the images WITH a 'crossOrigin' setting to get access to it's pixel sizes.

And iOS is buggy here - it caches the images without the crossOrigin setting, but then when loading from the cache and trying the access the problem happens. Correct working browsers don't have that problem.

A 'workaround' could be adding '?nocache=%$random%' to the image urls to disable the caching, then it should but with disabled caching = slower loading of course.

For iOS it would be generally a good recommendation trying to avoid any cross-origin access, e.g. cross-origin video isn't working too in iOS.

Best regards,
Klaus

andrew22222

Intermediate

Posts: 341

Location: Australia

  • Send private message

3

Friday, October 6th 2017, 11:31pm

Hi Jordi,

I too had that issue back in August

https://krpano.com/forum/wbb/index.php?p…72367#post72367

In the end I could only get the thumbnails to show by leaving them with the tour and not up on S3 with the pano tiles.

I had the panos folder as normal with the tour on the regular website hosting plus all the tile folders inside but each of those only contained the thumb.jpg

The url in the scene xml was

thumburl="panos/001.tiles/thumb.jpg"



Then for the pano

Source code

1
2
3
4
5
6
7
8
		<preview url="path-to-my-S3-bucket/panos/001.tiles/preview.jpg" />

		<image>
			<cube url="path-to-my-S3-bucket/panos/001.tiles/pano_%s.jpg" />
			<mobile>
				<cube url="path-to-my-S3-bucket/panos/001.tiles/mobile_%s.jpg" />
			</mobile>
		</image>




I used the code supplied by Klaus ( '?nocache=%$random%' ) for the 20 image galleries that I had in the tour as they too wouldn't display the images like the thumbnail issue but I needed these in the S3 bucket and not on the hosting so will have to make do with the no cache.

Hope that helps.



Andrew

jordi

Intermediate

  • "jordi" started this thread

Posts: 464

Location: Barcelona

Occupation: creating ideas & coding them

  • Send private message

4

Saturday, October 7th 2017, 12:17pm

Thanks Klaus,

I have successfully implemented that in the code and now it's working properly everywhere.

was not only in iOS but also on Safari...
everpano.com step beyond 360