IE6以下のブラウザでは上手く表示できない可能性があります
また、IE6には多くのバグがあるためブラウザの変更を強く推奨します
また、IE6には多くのバグがあるためブラウザの変更を強く推奨します
HIYOKOのページ
前のページへ
Page 1 2 3 4 5
HTTPサーバーはアドレスにファイル名の指定がないとindex.htmlというファイルを探して表示するようになっています
現段階ではファイルがないのでサーバーを動かしても何も出来ません
まずはindex.htmlを作ってみましょう
メモ帳を開き次のような文章を書き込みD:/My server/にindex.htmlという名前で保存します
こんなHTMLじゃ正しくない！いい加減すぎる！って思う方はもっとちゃんと書いたもの作ってみてね
そしたらApacheが動いているのを確認して(動いてなかったらXAMPPのコントロールパネルを出してStartを押してね)、 なにかしらのブラウザを立ち上げてアドレス"http://my_server/"を入力してください
アドレスにindex.htmlは未入力で大丈夫です 入れても良いけど
これでブラウザに「これはローカルの”my_server”のindex.htmlです」と表示されればローカルサーバーの立ち上げ成功です
もしも表示されなかった人は今までの設定内容をよく確かめてみてください
それでもダメだった場合は、残念ながら他所のページなどを参考に自分で解決方法を探してください･･･御免
WebGLではテクスチャ等の利用にローカルファイルが使えない、ということで立ち上げたローカルサーバーですが
では実際にどのように使えば良いのか？
答えとしてはローカルのhtmlファイルを開くのではなく、ブラウザにローカルサーバーのアドレスを入力して使うという形になります
ちょっと言葉だけだとイメージしにくいかもしれません
実際にテクスチャを使うサンプルをフォルダに置いて動作を見てみましょう
マルチテクスチャのサンプルページのフォルダ内容一式をzipにして置いておきますので、これを使って動作や使用法を説明します
multi_texture.zip
zipファイルを解凍したらフォルダごとD:/My server/に置いておきましょう
そしてD:/My server/multi_texture/に移動します
まずはローカルサーバーのファイルとしてhtmlを開くのではなく、ローカルのファイルとしてhtmlを開いてみます
multi_textureフォルダの中のSample.htmlをGoogleChromeで開いてみましょう
開いた時にアドレス欄がfile:///で始まっていることに注目してください
ローカルファイルとしての表示なのでテクスチャがロードされず空のテクスチャを参照してしまい真っ黒に表示されています
コンソールを表示すると
Uncaught SecurityError: Failed to execute 'texImage2D' on 'WebGLRenderingContext': the cross-origin image at ファイル may not be loaded.
というエラーメッセージです
クロスドメインイメージなのでセキュリティ上ロードできないって感じの意味です
それでは今度はローカルサーバー上のデータとして全く同じhtmlにアクセスしてみます
Apacheが動作している状態で、アドレス欄にhttp://my_server/multi_texture/Sample.htmlと入力し、エンターキーを押して表示してみましょう
無事表示できました
コンソールを見るといくつか警告が出てますが、これはテクスチャー画像の読み込みが終わらない状態でテクスチャーを使用しようとしているため警告が出ているのです
テクスチャが表示されるようになった時には警告が出なくなっているはず
と、このようにサーバーのデータとして読み込むにはブラウザにローカルサーバーファイルとしてのアドレスが入力されなければいけません
動作確認のために毎回ブラウザに手動でURLを入力するのは面倒ですね
というわけで起動を楽にするためにショートカットを作ってみましょう
作り方は普通にフォルダで右クリック→新規作成→ショートカットで作ります
項目の場所というところにURL(http://my_server/multi_texture/Sample.html)を入力します
名前は適当に付けて作成
あとはショートカットをダブルクリックで既定のブラウザで開けます
規定のブラウザとしてGoogleChrome等を設定しましょう
これでテクスチャを使ったサンプルをダブルクリックで動作確認が出来るようになりました
以上でローカルサーバーの立ち上げレクチャーは終了です
お疲れ様でした
設定も面倒くさいけど説明もっと面倒くさい・・・
たかがテクスチャ使うだけなのにこんなに面倒な手順を踏まないと動作確認が出来ないんだねWebGL
最初テクスチャ使ったとき上手くいかなくてあせったあせった
というわけで重い腰を上げて解説ページ作りました
誰かの参考になっていれば幸いです
上手くいかなかったらごめんなさい･･･
一応いい加減なことは書かないように気をつけてはいるつもりですが、PC環境の差から上手くいかない人や
OSの条件が違う人とか、XAMPPが新しくなってて参考にならない人など居るかもしれません
個人の力ではどうしても全ての環境や最新の状態をサポートできませんので
当ページを参考にしつつ他のXAMPPの解説サイト等を組み合わせて設定をしてみてください
Page 1 2 3 4 5
Page 1 2 3 4 5
ローカルサーバーの使用方法
設定の成否を確認
まずはこれまでの設定が上手く行っているかどうかの確認の意味も込めて、とりあえずHTMLを表示させてみましょうHTTPサーバーはアドレスにファイル名の指定がないとindex.htmlというファイルを探して表示するようになっています
現段階ではファイルがないのでサーバーを動かしても何も出来ません
まずはindex.htmlを作ってみましょう
メモ帳を開き次のような文章を書き込みD:/My server/にindex.htmlという名前で保存します
<html>
<body>
これはローカルの”my_server”のindex.htmlです
</body>
</html>
ちょっといい加減ですがとりあえずHTMLとして表示できるでしょうこんなHTMLじゃ正しくない！いい加減すぎる！って思う方はもっとちゃんと書いたもの作ってみてね
そしたらApacheが動いているのを確認して(動いてなかったらXAMPPのコントロールパネルを出してStartを押してね)、 なにかしらのブラウザを立ち上げてアドレス"http://my_server/"を入力してください
アドレスにindex.htmlは未入力で大丈夫です 入れても良いけど
これでブラウザに「これはローカルの”my_server”のindex.htmlです」と表示されればローカルサーバーの立ち上げ成功です
もしも表示されなかった人は今までの設定内容をよく確かめてみてください
それでもダメだった場合は、残念ながら他所のページなどを参考に自分で解決方法を探してください･･･御免
WebGLを使用する上でのサーバー利用法
WebGLではテクスチャ等の利用にローカルファイルが使えない、ということで立ち上げたローカルサーバーですが
では実際にどのように使えば良いのか？
答えとしてはローカルのhtmlファイルを開くのではなく、ブラウザにローカルサーバーのアドレスを入力して使うという形になります
ちょっと言葉だけだとイメージしにくいかもしれません
実際にテクスチャを使うサンプルをフォルダに置いて動作を見てみましょう
マルチテクスチャのサンプルページのフォルダ内容一式をzipにして置いておきますので、これを使って動作や使用法を説明します
multi_texture.zip
zipファイルを解凍したらフォルダごとD:/My server/に置いておきましょう
そしてD:/My server/multi_texture/に移動します
まずはローカルサーバーのファイルとしてhtmlを開くのではなく、ローカルのファイルとしてhtmlを開いてみます
multi_textureフォルダの中のSample.htmlをGoogleChromeで開いてみましょう
開いた時にアドレス欄がfile:///で始まっていることに注目してください
ローカルファイルとしての表示なのでテクスチャがロードされず空のテクスチャを参照してしまい真っ黒に表示されています
コンソールを表示すると
Uncaught SecurityError: Failed to execute 'texImage2D' on 'WebGLRenderingContext': the cross-origin image at ファイル may not be loaded.
というエラーメッセージです
クロスドメインイメージなのでセキュリティ上ロードできないって感じの意味です
それでは今度はローカルサーバー上のデータとして全く同じhtmlにアクセスしてみます
Apacheが動作している状態で、アドレス欄にhttp://my_server/multi_texture/Sample.htmlと入力し、エンターキーを押して表示してみましょう
無事表示できました
コンソールを見るといくつか警告が出てますが、これはテクスチャー画像の読み込みが終わらない状態でテクスチャーを使用しようとしているため警告が出ているのです
テクスチャが表示されるようになった時には警告が出なくなっているはず
と、このようにサーバーのデータとして読み込むにはブラウザにローカルサーバーファイルとしてのアドレスが入力されなければいけません
動作確認のために毎回ブラウザに手動でURLを入力するのは面倒ですね
というわけで起動を楽にするためにショートカットを作ってみましょう
作り方は普通にフォルダで右クリック→新規作成→ショートカットで作ります
項目の場所というところにURL(http://my_server/multi_texture/Sample.html)を入力します
名前は適当に付けて作成
あとはショートカットをダブルクリックで既定のブラウザで開けます
規定のブラウザとしてGoogleChrome等を設定しましょう
これでテクスチャを使ったサンプルをダブルクリックで動作確認が出来るようになりました
以上でローカルサーバーの立ち上げレクチャーは終了です
お疲れ様でした
あとがき
いやー長かった設定も面倒くさいけど説明もっと面倒くさい・・・
たかがテクスチャ使うだけなのにこんなに面倒な手順を踏まないと動作確認が出来ないんだねWebGL
最初テクスチャ使ったとき上手くいかなくてあせったあせった
というわけで重い腰を上げて解説ページ作りました
誰かの参考になっていれば幸いです
上手くいかなかったらごめんなさい･･･
一応いい加減なことは書かないように気をつけてはいるつもりですが、PC環境の差から上手くいかない人や
OSの条件が違う人とか、XAMPPが新しくなってて参考にならない人など居るかもしれません
個人の力ではどうしても全ての環境や最新の状態をサポートできませんので
当ページを参考にしつつ他のXAMPPの解説サイト等を組み合わせて設定をしてみてください
Page 1 2 3 4 5
2013/12/15掲載
FC2カウンター