Orbitvu Public Support Site

Hostowanie Prezentacji 360° na własnym serwerze

Updated Mar 01, 2021

Do hostowania prezentacji na własnym serwerze potrzebujesz:

  • dostęp do serwera (kopiowanie plików i konfiguracja serwera HTTP)
  • własną kopię ORBITVU VIEWER (musisz zakupić licencję lub skorzystać z ORBITVU VIEWER Free360)
  • Prezentacja 360°
  • troche wiedzy technicznej na temat HTML i administracji serwerami
  • musisz zrozumieć czym jest ORBITVU PRESENTATION oraz czym jest ORBITVU VIEWER.

Rozlokowanie

  • VIEWER
    • Skopiuj ORBITVU VIEWER na Twój serwer (skopiuj folder orbitvu12/)
    • Skonfiguruj swój serwer WWW tak, aby obsługiwał pliki z folderu orbitvu12/ (upewnij się, że są one publicznie dostępne pod pewnym adresem URL, np.: http://twojadomena.com/orbitvu12/)
  • Prezentacje
    • Skopiuj Prezentacje na swój serwer (zwykle będziesz używać klienta FTP)
    • Skonfiguruj swój serwer WWW tak, aby obsługiwał pliki prezentacji pod niektórymi publicznie dostępnymi adresami URL, np.: http://twojadomena.com/presentations/
  • Konfiguracja serwera
    • Dodaj nagłówek Access-Control-Allow-Origin*; zarówno do adresu URL VIEWER jak i URL Prezentacji aby uniknąć potencjalnych problemów z CORS (Cross-origin resource sharing)
    • Dodaj crossdomain.xml do domeny używanej do obsługi plików prezentacji w celu uniknięcia problemów z bezpieczeństwem Flash, np.: https://mydomain.com/crossdomain.xml
  • Kodowanie
    • Utwórz strony internetowe, które wykorzystają Twoj ORBITVU VIEWER i Twoje adresy URL prezentacji (szczegóły poniżej).

Możesz również uzyskać i skonfigurować certyfikat SSL dla swojej domeny, który jest wymagany. np. jesli będziesz chciał dodać integrację z Facebookiem.

Kodowanie stron internetowych

  • Wczytaj skrypty pomocnicze ORBITVU VIEWER
    Możesz dodać skrypty do sekcji<head> na stronie.
<script type="text/javascript" src="http://yourdomain.com/orbitvu12/orbitvu.js"></script>
  • Utwórz element kontenera do prezentacji
    Utwórz element kontenera, do którego zostanie wstrzyknięta Twoja prezentacja. Konieczne jest ustawienie unikalnego identyfikatora dla tego kontenera.
<div id="presentation1-container"></div>

Jeśli chcesz mieć wiele prezentacji na swojej stronie, po prostu utwórz kontener z unikalnym identyfikatorem dla każdej z nich.

  • Wstrzyknięcie prezentacji
    Ostatnim krokiem jest wywołanie funkcji JavaScript inject_orbitvu, która wstrzykuje prezentację do kontenera.
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
<script type="text/javascript">
    inject_orbitvu(
        'presentation1-container',
        'http://yourdomain.com/orbitvu12/',
        '',
        {
            ovus_folder: "http://yourdomain.com/presentations/presentation1/",
            content2: 'yes',
            width: "500",
            height: "400"
        });
</script>

Linia 3:

id elementu kontenera

Linie 4-5:

URL do plików ORBITVU VIEWER (hostowanych na Twoim serwerze)

Linia 7:

URL do katalogu prezentacji (hostowanego na Twoim serwerze)

Linia 8:

Ustaw na yes, jeśli w katalogu prezentacji znajduje się plik content2.xml, w przeciwnym razie ustaw na nie lub usuń

Linie 9-10:

Inne parametry ORBITVU VIEWER. Więcej informacji na ten temat można znaleźć w częsci lista parametrów.

Skrypt pomocniczy musi być załadowany PRZED wywołaniem inject_orbitvu.

Jeśli masz wiele prezentacji na swojej stronie, musisz wywołać inject_orbitvu dla każdej z nich.

Możesz wywołać inject_orbitv wewnątrz obsługi zdarzenia onready. 

Kompletny przykład

Przykład wykorzystuje jQuery do odroczenia wykonania JavaScript do czasu załadowania strony

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />

        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script type="text/javascript" src="http://yourdomain.com/orbitvu12/orbitvu.js"></script>

        <script type="text/javascript">
            $(function() {
                inject_orbitvu(
                  'presentation1-container',
                  'http://yourdomain.com/orbitvu12/orbitvuer12.swf',
                  'http://yourdomain.com/orbitvu12/expressInstall.swf',
                  {
                      ovus_folder: "http://yourdomain.com/presentations/presentation1/",
                      content2: "yes",
                      width: "500",
                      height: "400"
                  });
            });
        </script>
    </head>
    <body>
        <h1>Some text</h1>

        <div id="presentation1-container"></div>
    </body>
</html>

Zadbaj o ustawienie odpowiedniego DOCTYPE dla Twojej strony, zwłaszcza dla przeglądarki Internet Explorer

Previous Article Osadzenie ORBITTOUR przy użyciu kodu ORBITVU SUN
Next Article Nagłówki CORS strony serwera
Still Need Help? Contact Us