読者です 読者をやめる 読者になる 読者になる

UnityでWebGLビルドしたものをDropboxで公開する

Unity

タイトルなしタイトルなし / yoppy
 WebGLでビルドしたあと、公開するにはちょっと手を加える必要があります。
簡単に言うと、リンクを修正してやる必要があります。

Step1 とりあえずアップロード

f:id:pongeponge:20160509172001j:plain
 ビルドすると上記のファイル&フォルダができます。
とりあえず、これを全部DropboxのPublicフォルダ内にアップロードします。

Step2 公開リンクの取得

 index.htmlの公開リンクを取得します。
ブラウザ上で操作してる場合は、右クリック→公開リンクのコピーで取得できます。


 取得した公開リンクは
https://dl.dropboxusercontent.com/(保存フォルダ)/index.html
となっていますが、必要なのはindex.html以外の部分です。

Step3 index.htmlの修正

 修正が必要なファイルはindex.htmlTemplateData内のUnityProgress.js、この2つ。


 まずindex.htmlの修正箇所は、8つ。

<!doctype html>
<html lang="en-us">
    (中略)
    <link rel="stylesheet" href="https://dl.dropboxusercontent.com/(保存フォルダ)/TemplateData/style.css">
    <link rel="shortcut icon" href="https://dl.dropboxusercontent.com/(保存フォルダ)/TemplateData/favicon.ico" />
    <script src="https://dl.dropboxusercontent.com/(保存フォルダ)/TemplateData/UnityProgress.js"></script>
    (中略)
      <div class="fullscreen"><img src="https://dl.dropboxusercontent.com/(保存フォルダ)/TemplateData/fullscreen.png" width="38" height="38" alt="Fullscreen" title="Fullscreen" onclick="SetFullscreen(1);" /></div>
    (中略)
    dataUrl: "https://dl.dropboxusercontent.com/(保存フォルダ)/Release/(ファイル名).data",
    codeUrl: "https://dl.dropboxusercontent.com/(保存フォルダ)/Release/(ファイル名).js",
    memUrl: "https://dl.dropboxusercontent.com/(保存フォルダ)/Release/(ファイル名).mem",
    (中略)
    <script src="https://dl.dropboxusercontent.com/(保存フォルダ)/Release/UnityLoader.js"></script>
</html>

修正が済めば保存。

Step4 UnityProgress.jsの修正

 次にTemplateData内のUnityProgress.jsの修正箇所は3つ。

function UnityProgress (dom) {
	(中略)
	logoImage.src = "https://dl.dropboxusercontent.com/(保存フォルダ)/TemplateData/progresslogo.png"; 
	(中略)
	progressFrame.src = "https://dl.dropboxusercontent.com/(保存フォルダ)/TemplateData/loadingbar.png"; 
	(中略)
	progressBar.src = "https://dl.dropboxusercontent.com/(保存フォルダ)/TemplateData/fullbar.png"; 
	(中略)
}

修正が終われば保存。

Step5 上書き

 ブラウザ上で操作してる場合は、修正したファイルを上書きアップロードすること。

Step6 チェック

 index.htmlの公開コピーを取って、ブラウザでちゃんと動くか確認。
動くようならリンクをブログやツイートに貼って公開しましょう。


 DropBox以外で、サーバーにアップロードする場合も同じようにすれば多分いけるはず。


キャラクターであそぼう! Unity日和。 ?UnityでBlender自作キャラクターを読み込んで楽しむ、シーン作り

キャラクターであそぼう! Unity日和。 ?UnityでBlender自作キャラクターを読み込んで楽しむ、シーン作り