SOLVED: Best way to embed virtual tours hosted in a different domain

Tourvista

Intermediate

Posts: 260

Location: Leicester UK

1

Thursday, March 21st 2013, 10:43am

Thank you very much in advance for helping!

What do you suggest is the best way to embed virtual tours in my clients website, if a virtual tour is hosted in our server?

I'm really struggling with this! iframes don't look reliable any more with mobile devices!

Currently, part of my embedding code is like this:

	Source code
1	embedpano({swf:"files/tour.swf", xml:"files/tour.xml", target:"pano", html5:"auto", passQueryParameters:true});

I'm trying to use an absolute url, like this:

	Source code
1	embedpano({swf:"http://mywebsite.com/files/tour.swf", xml:"http://mywebsite.com/files/tour.xml", target:"pano", html5:"auto", passQueryParameters:true});

But it doesn't work because it can't find tour.swf neither tour.xml
Please note that all the files are hosted in a different domain.

Any ideas?

Cheers

Rafael

360 Virtual tours

This post has been edited 1 times, last edit by "Tourvista" (Apr 9th 2013, 12:00pm)

Go to the top of the page

Umalo

Professional

Posts: 1,051

Location: Osijek, Croatia, EU

2

Thursday, March 21st 2013, 6:50pm

Maybe: crossdomain.xml
Or: limided domain in the krpano Protect Tool when creating the SWF

Go to the top of the page

Tourvista

Intermediate

Posts: 260

Location: Leicester UK

3

Friday, March 22nd 2013, 10:37am

Still baffled

Until now we have been solely using iframes however we're finding more and more issues when displayed on an iPad or iPhone.

Can anyone please post an example of how they embed?

Rafael

360 Virtual tours

Go to the top of the page

Tourvista

Intermediate

Posts: 260

Location: Leicester UK

4

Friday, March 22nd 2013, 2:52pm

Getting there!

Okay, so we've got it working for desktops but iOS is still not looking so good and it's reporting a fatal error 'loading or parsing failed;

This is our embed code:

...............
<script src="http://www.clients.tourvista.co.uk/vt/hr_owen/cars/bentley/files/tour.js"></script>
<script src="http://www.clients.tourvista.co.uk/vt/hr_owen/cars/bentley/files/plugins/swfaddress.js?tracker=null"></script>
<div id="pano" style="680px; height:560px;">
<noscript>
<div id="align_centre"> <b>Attention:</b><br/> <p>Your browser's Javascript is not activated.</p> <p>Please activate it to see the virtual tour.</p><br/> </div>
</noscript>

<script>
embedpano({swf:"http://www.clients.tourvista.co.uk/vt/hr_owen/cars/bentley/files/tour.swf", xml:"http://www.clients.tourvista.co.uk/vt/hr_owen/cars/bentley/files/tour20130207161636.xml", target:"pano", html5:"auto", passQueryParameters:true});
</script>
...............

The xml file contains the crossdomain.xml link which looks like the following:

...............

<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy SYSTEM "http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
<allow-access-from domain="clients.tourvista.co.uk" />
<allow-access-from domain="www.clients.tourvista.co.uk" />
<allow-access-from domain="http://www.clients.tourvista.co.uk" />
<allow-access-from domain="tourvista.co.uk" />
<allow-access-from domain="www.tourvista.co.uk" />
</cross-domain-policy>

.............

Has anyone got any ideas?

Rafael

360 Virtual tours

Go to the top of the page

Umalo

Professional

Posts: 1,051

Location: Osijek, Croatia, EU

5

Saturday, March 23rd 2013, 11:39pm

did you tested your tour on IOS? (EDIT: oh, silly question. You did as you obviously detected error there)
You can use IPAD simulator provided by Krpano. I assume there is some code inconsistency that IOS don't like.
Maybe empty data <data name="coordinates"></data> or something else.

Also you can try removing security section. Maybe IOS don't like included xml that has no Krpano tags.

(also have sent you pm)

Go to the top of the page

Tourvista

Intermediate

Posts: 260

Location: Leicester UK

6

Tuesday, March 26th 2013, 6:06pm

Hi!

Sorry for taking so long to reply. We've been very busy the last couple of days with this issue!

We've managed to make a flash virtual tour working crossdomain, but we're stuck how to make it work for the ipad!!!

This is the html code to embed the virtual tour:

www.clients.tourvista.co.uk/vt/gforces/alfa_romeo/cross.html

The virtual tour xml file is here:

http://www.clients.tourvista.co.uk/vt/gf…/files/tour.xml

You can see that I've added the crossdomain tags:

	Source code
1	<security><crossdomainxml url="http://clients.tourvista.co.uk/vt/gforces/crossdomain.xml" /></security>

And the crossdomain.xml file is here:

http://www.clients.tourvista.co.uk/vt/gf…crossdomain.xml

The error I get in the iPad is:
FATAL ERROR:
http://www.clients.tourvista.co.uk/vt/gf…/files/tour.xml - loading or parsin failed!

As I said I'm completely stuck! *unsure*

Rafael

360 Virtual tours

Go to the top of the page

Umalo

Professional

Posts: 1,051

Location: Osijek, Croatia, EU

7

Wednesday, March 27th 2013, 1:15am

I think your problem lies in usage of SWF instead of FIRSTXML. I think viewer on IPAD|IPHONE can't know where SWF is as it is not definied "to him". As I could't change your code on your server I downloaded it and uploaded on my server and changed SWF to apsolute path to your folder and sudenly IPAD simulator brought the pano. More details you have on your PM not to spam forum with links to xml that I will soon remove (as soon you got it for comparison)

Umalo has attached the following image:

Go to the top of the page

Umalo

Professional

Posts: 1,051

Location: Osijek, Croatia, EU

8

Thursday, March 28th 2013, 6:57pm

Did some tests today embeding from ServerA to ServerB and you are right. It does not work on IOS.

So reading forum it seams that we need to adapt "Access-Control-Allow-Origin":
link to forum

Reading: outside link
it seams simplest to adapt .htaccess file with:

SetEnvIf Origin "^http(s)?://(.+\.)?(domain\.org|domain2\.com)$" origin_is=$0
Header always set Access-Control-Allow-Origin %{origin_is}e env=origin_is

Have asked my guru to do it and will come to you with results if you will not be the faster to prove this concept.
regards
Umalo

EDIT: Confirmed working solution: Domain added in .htaceess ,with no SWFPATH but FIRSTXML references and clean XMLs.

This post has been edited 1 times, last edit by "Umalo" (Mar 29th 2013, 11:42am)

Go to the top of the page

inside22

Beginner

Posts: 15

Location: Azerbaijan

9

Friday, March 29th 2013, 9:24am

The problem is solved by using IFRAME.

	Source code
1	<iframe src="Untitled-1.html" scrolling="no" frameborder="0" allowtransparency="yes"></iframe>

inside22 has attached the following file:

www.zip (1.01 kB - 145 times downloaded - latest: Today, 11:04am)

www.360view.az

Go to the top of the page

Tourvista

Intermediate

Posts: 260

Location: Leicester UK

10

Tuesday, April 9th 2013, 11:50am

Hi everyone!

We finally managed to make this work!

The trick was change every single path (both html and xml files) from

%SWFPATH%/folder/subfolder/file
to
http://hostname.com/folder/subfolder/file

Thanks everyone for helping!

Rafael

360 Virtual tours

Go to the top of the page

SEA7

Beginner

Posts: 4

Location: Brooklyn, NY

Occupation: Photographer

11

Thursday, June 13th 2013, 11:01pm

Best way to embed virtual tours hosted in a different domain

I am a complete newbie to krpano and not a programmer to boot. I have been using FPP and had the iframe thing worked out. Now I am screwed. Don't have any idea how to do this. I read the thread and still don't know what to do.

I do, however have the same situation. All tours are hosted on our servers and we want to keep it that way. I need a full packet of code and some help screwing it together to get my old clients' tours working in krpano.

Example:
Cupecoy Condo Virtual tour page in FPP

This is the code from the client's page:

Source code

<table cellspacing="0" cellpadding="3" width="100%" border="0">
		<tr>
			<td style="text-align:left">
			    <span id="ctl00_ContentPlaceHolder1_lblDescription">To see other views and experience the dramatic impact of the full-screen virtual tour, please click on the |FULLSCREEN| icon in the image below. The small images on the navigation bar link to other panoramas. Zoom with the wheel on your mouse. If you have no wheel, find the |ZOOM| icon in the full-screen mode.
</span>
			    <p ”) used on a non-void HTML element. Ignoring the slash and treating as a start tag." class="error">/>
			</td>
		</tr>
		<tr>
		    <td id="ctl00_ContentPlaceHolder1_cellVideo" align="center">
		    <!--Video Start-->
                <iframe src ="http://www.venueview.com/panorama/h6/iframe_600x325.html"  width="600" height="325" scrolling="no" frameborder="no"> <p>Your browser does not support iframes. View the video at its source:  <a href="http://www.venueview.com/panorama/h6/iframe_600x325.html">  http://www.venueview.com/panorama/h6/iframe_600x325.html</a></p></iframe><br><br><br><br><br><br>
            <!--Video End-->
            </td>

            
		</tr>
</table>

This is the target file on our server:

Source code

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”><head>

<title>H6 The Cliff at Cupecoy On the 'Gold Coast' of St Maarten</title>

<style>
<!--
/* hide from ie5 mac */
html {
  height: 100%;
}
#flashcontent {
  height: 325;
  text-align: center;
}
/* end hide */
body {
  height: 100%;
  margin: 0;
  padding: 0;
  padding-top: 0px;

}
-->
</style>
<script type="text/javascript" src="base/swfobject.js"></script>

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-15665095-1']);
  _gaq.push(['_trackPageview']);

  (function() {
	var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
	ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
	var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

</head>

<body>

<div id="flashcontent">
This content requires <a href="http://www.adobe.com/go/getflashplayer/">Adobe Flash Player 9.</a>  Please, visit <a href="http://www.adobe.com/go/getflashplayer/">adobe.com</a> to install it
</div> 
	<script type="text/javascript">
		var so = new SWFObject("base/fpp/pano.swf", "vv_pano", "600", "325", "6.0.65", "#323741"); 
		so.addVariable("xml_file","base/_setup_h6.xml");
		so.addParam("allowFullScreen","true");
		so.addParam("allowScriptAccess","sameDomain");
		so.write("flashcontent");
	</script>

</body>
</html>

I need to get help translating the whole mess so I can swap the FPP tour for the krpano tour without changing the code on the client site (if possible).

This is killing me since I have managed to translate my pans/tilts/zooms and timing from FPP to krpano with less trouble than I expected (many thanks to Klaus for the critical sequencing code) but I thought the iframe would be easy. OOPS!

HELP!!!!! *confused*

Stephen

Go to the top of the page

Tourvista

Intermediate

Posts: 260

Location: Leicester UK

12

Sunday, July 21st 2013, 12:22pm

Hello Stephen,

Did you managed to solve this?

Cheers,

Rafael

Rafael

360 Virtual tours

Go to the top of the page

xiaoshuang

Beginner

Posts: 2

13

Friday, August 12th 2016, 4:12am

I created the crossdomain.xml and upload to the domain. Work well.

<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy SYSTEM "http://www.adobe.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
<site-control permitted-cross-domain-policies="all"/>
<allow-access-from domain="*" secure="false"/>
<allow-http-request-headers-from domain="*" headers="*" secure="false"/>
</cross-domain-policy>

I get from this https://www.adobe.com/devnet-docs/acroba…ec/xdomain.html.

Go to the top of the page