【实战】下载比基尼全景的全景图

首先我们不管如何，得有一个html地址，从这个html地址我们能够在pc浏览器上查看全景。

http://www.sankei.com/photo/panorama/edit/150627_0/150627toshimaen0.html

在浏览器打开地址（该地址目前失效），然后利用浏览器的查看源代码工具（遨游为工具——查看源代码快捷键 Ctrl+U）：

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
  <title>Virtual Tour generated by Panotour</title>
  <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
  <meta name="apple-mobile-web-app-capable" content="yes"/>
  <style type="text/css">
    @media only screen and (min-device-width: 800px) { html { overflow:hidden; } }
    * { padding: 0; margin: 0; }
    html { height: 100%; }
    body { height: 100%; overflow:hidden; }
    #container { height: 100%; min-height: 100%; width: 100%; margin: 0 auto; }
  </style>
</head>
<body>
  <script src="swfobject/swfkrpano.js"></script>
  <div id="container">
      <div id="panoDIV" style="height:100%;">
        <script>
          embedpano({target:"panoDIV",swf:"150627toshimaen0.swf"});
        </script>
          <noscript>
            <div id="tour">
              <object width="100%" height="100%">
                <embed src="150627toshimaen0.swf" width="100%" height="100%" allowFullScreen="true"></embed>
              </object>
            </div>
          </noscript>
        </div>
      </div>
</body>
</html>

<!DOCTYPE html>

<html>

<head>

<title>Virtual Tour generated by Panotour</title>

@media only screen and (min-device-width: 800px) { html { overflow:hidden; } }

* { padding: 0; margin: 0; }

html { height: 100%; }

body { height: 100%; overflow:hidden; }

#container { height: 100%; min-height: 100%; width: 100%; margin: 0 auto; }

</style>

</head>

<body>

embedpano({target:"panoDIV",swf:"150627toshimaen0.swf"});

</script>

</object>

</div>

</noscript>

</div>

</body>

</html>

我们在这段代码里面只看到一个SWF（150627toshimaen0.swf）文件，同时我们用遨游的资源嗅探器发现有一个4M多的swf文件。可以认为桌面端（分辨率最高的全景）已经打包到SWF文件。要从这个SWF文件提取出全景，几乎是不可完成的任务。但是因为我们知道上述html地址在手机端，也就是html5 viewer下是可以看的。HTML5能看的话说明有对应的移动端的全景图（分辨率稍差）。我们把上面的html地址中的html改为xml，在浏览器中粘贴后打开：

http://www.sankei.com/photo/panorama/edit/150627_0/150627toshimaen0.xml

很幸运，我们看到了熟悉的xml代码，都是krpano的代码。但在这个文件中没找到image元素，因为image元素是控制全景图展示的元素。我们猜想应该不止这一个xml文件，于是我们搜索关键字“include”，果然发现了一行代码：

<include url="150627toshimaen00.xml"/>

1	<include url="150627toshimaen00.xml"/>

原来还有一个xml文件，于是我们继续在浏览器打开这个xml文件：

http://www.sankei.com/photo/panorama/edit/150627_0/150627toshimaen00.xml

这次我们在里面找到了image元素。

 <image type="CUBE" multires="true" tilesize="326" baseindex="0">
        <!-- mobile phone / iphone images -->
        <mobile>
            <left url="150627toshimaen0data/150627toshimaen00/3/mobile_face.jpg"/>
            <front url="150627toshimaen0data/150627toshimaen00/0/mobile_face.jpg"/>
            <right url="150627toshimaen0data/150627toshimaen00/1/mobile_face.jpg"/>
            <back url="150627toshimaen0data/150627toshimaen00/2/mobile_face.jpg"/>
            <up url="150627toshimaen0data/150627toshimaen00/4/mobile_face.jpg"/>
            <down url="150627toshimaen0data/150627toshimaen00/5/mobile_face.jpg"/>
        </mobile>
        <!-- tablet pc / ipad images -->
        <tablet>
            <left url="150627toshimaen0data/150627toshimaen00/3/tablet_face.jpg"/>
            <front url="150627toshimaen0data/150627toshimaen00/0/tablet_face.jpg"/>
            <right url="150627toshimaen0data/150627toshimaen00/1/tablet_face.jpg"/>
            <back url="150627toshimaen0data/150627toshimaen00/2/tablet_face.jpg"/>
            <up url="150627toshimaen0data/150627toshimaen00/4/tablet_face.jpg"/>
            <down url="150627toshimaen0data/150627toshimaen00/5/tablet_face.jpg"/>
        </tablet>
    </image>