You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
167 lines
5.9 KiB
167 lines
5.9 KiB
<!DOCTYPE html>
|
|
<html lang="it">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<base href="../../../" />
|
|
<script src="page.js"></script>
|
|
<link type="text/css" rel="stylesheet" href="page.css" />
|
|
</head>
|
|
<body>
|
|
<h1>Esecuzione in locale ([name])</h1>
|
|
<p>
|
|
Se si usano solo geometrie procedurali e non si caricano texture, le pagine web dovrebbero funzionare direttamente
|
|
dal file system, basta fare doppio click sul file HTML in un file manager e la pagina dovrebbe apparire funzionante nel browser
|
|
(si vedrà <em>file:///yourFile.html</em> nella barra degli indirizzi del browser).
|
|
</p>
|
|
|
|
<h2>Contenuto caricato da file esterni</h2>
|
|
<div>
|
|
<p>
|
|
Se si caricano modelli o texture da file esterni, a causa delle restrizioni di sicurezza del [link:http://en.wikipedia.org/wiki/Same_origin_policy same origin policy] del browser,
|
|
il caricamento da un file system fallirà con un'eccezione di sicurezza.
|
|
</p>
|
|
|
|
<p>
|
|
Per risolvere questo problema, conviene eseguire i file da un server locale. Questo permette di accedere alla pagina come:
|
|
</p>
|
|
|
|
<p>
|
|
<code>http://localhost/yourFile.html</code>
|
|
</p>
|
|
|
|
<p>
|
|
Anche se è possibile cambiare le impostazioni di sicurezza del browser invece di lanciare un server in locale,
|
|
non lo raccomandiamo. Utilizzando questo approccio si potrebbe esporre il proprio dispositivo a molte vulnerabilità soprattutto se
|
|
lo stesso browser viene utilizzato per la regolare navigazione sul web. Usare un server locale è una pratica standard nello sviluppo
|
|
web. Qui sotto, spieghiamo come si installa e utilizza un server locale.
|
|
</p>
|
|
</div>
|
|
|
|
|
|
<h2>Eseguire un server locale</h2>
|
|
<div>
|
|
<p>
|
|
Molti linguaggi di programmazione hanno semplici server HTTP integrati. Non sono completi come i server di produzione
|
|
come ad esempio [link:https://www.apache.org/ Apache] o [link:https://nginx.org NGINX], ma sono sufficienti per testare la tua applicazione three.js.
|
|
</p>
|
|
|
|
<h3>Plugin per i principali editor</h3>
|
|
<div>
|
|
<p>Alcuni editor hanno plugin che genereranno un semplice server su richiesta.</p>
|
|
<ul>
|
|
<li>[link:https://marketplace.visualstudio.com/items?itemName=yandeu.five-server Five Server] per Visual Studio Code.</li>
|
|
<li>[link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server] per Visual Studio Code.</li>
|
|
<li>[link:https://atom.io/packages/atom-live-server Live Server] per Atom.</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<h3>Servez</h3>
|
|
<div>
|
|
<p>
|
|
[link:https://greggman.github.io/servez Servez] è un semplice server con GUI.
|
|
</p>
|
|
</div>
|
|
|
|
<h3>Node.js five-server</h3>
|
|
<div>
|
|
<p>Server di sviluppo con un reload in tempo reale. Installazione:</p>
|
|
<code>
|
|
# Eliminare live-server (se è presente)
|
|
npm -g rm live-server
|
|
|
|
# Installare five-server
|
|
npm -g i five-server
|
|
|
|
# Aggiornare five-server (di volta in volta)
|
|
npm -g i five-server@latest
|
|
</code>
|
|
|
|
<p>Esecuzione (dalla tua cartella locale):</p>
|
|
<code>five-server . -p 8000</code>
|
|
</div>
|
|
|
|
<h3>Node.js http-server</h3>
|
|
<div>
|
|
<p>Node.js ha un semplice server HTTP. Installazione:</p>
|
|
<code>npm install http-server -g</code>
|
|
|
|
<p>Esecuzione (dalla tua cartella locale):</p>
|
|
<code>http-server . -p 8000</code>
|
|
</div>
|
|
|
|
<h3>Python server</h3>
|
|
<div>
|
|
<p>
|
|
Se hai installato [link:http://python.org/ Python], dovrebbe essere sufficiente eseguire
|
|
i seguenti comandi da terminale (dalla cartella di lavoro):
|
|
</p>
|
|
<code>
|
|
//Python 2.x
|
|
python -m SimpleHTTPServer
|
|
|
|
//Python 3.x
|
|
python -m http.server
|
|
</code>
|
|
|
|
<p>Questo servirà i file dalla cartella corrente a localhost sotto la porta 8000, cioè nella barra degli indirizzi digita:</p>
|
|
|
|
<code>http://localhost:8000/</code>
|
|
</div>
|
|
|
|
<h3>Ruby server</h3>
|
|
<div>
|
|
<p>Se hai installato Ruby, puoi avere lo stesso risultato eseguendo il seguente comando:</p>
|
|
<code>
|
|
ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"
|
|
</code>
|
|
</div>
|
|
|
|
<h3>PHP server</h3>
|
|
<div>
|
|
<p>Anche PHP ha un server web integrato, a partire da php 5.4.0:</p>
|
|
<code>php -S localhost:8000</code>
|
|
</div>
|
|
|
|
<h3>Lighttpd</h3>
|
|
<div>
|
|
<p>
|
|
Lighttpd è un server web generico molto leggero. Tratteremo l'installazione su OSX con HomeBrew.
|
|
Diversamente dagli altri server di cui abbiamo discusso qui, lighttpd è un server di produzione completo
|
|
pronto per la produzione.
|
|
</p>
|
|
|
|
<ol>
|
|
<li>
|
|
Installazione tramite homebrew
|
|
<code>brew install lighttpd</code>
|
|
</li>
|
|
<li>
|
|
Creare un file di configurazione chiamato lighttpd.conf nella cartella in cui vuoi eseguire il server.
|
|
[link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration Qui] trovi un esempio.
|
|
</li>
|
|
<li>
|
|
Nel file di configurazione deve essere cambiato il valore di server.document-root con la directory da cui vuoi servire i file.
|
|
</li>
|
|
<li>
|
|
Avvialo con
|
|
<code>lighttpd -f lighttpd.conf</code>
|
|
</li>
|
|
<li>
|
|
Inserisci l'indirizzo http://localhost:3000/ nella barra degli indirizzi del browser, questo servirà file statici
|
|
dalla cartella che hai scelto.
|
|
</li>
|
|
</ol>
|
|
</div>
|
|
<h3>IIS</h3>
|
|
<div>
|
|
<p>Se usi Microsoft IIS come web server. Per favore aggiungi le impostazioni del MIME type relative all'estensione .fbx prima del caricamento.</p>
|
|
<code>File name extension: fbx MIME Type: text/plain</code>
|
|
<p>Per impostazione predefinita IIS blocca i download di file .fbx, .obj. È necessario configurare IIS per abilitare il download di questo tipo di file</p>
|
|
</div>
|
|
<p>
|
|
Altre semplici alternative sono [link:http://stackoverflow.com/q/12905426/24874 trattate qui] su Stack Overflow.
|
|
</p>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|
|
|