Upload
yoshihiro-mizoguchi
View
436
Download
1
Embed Size (px)
DESCRIPTION
Macbook で Webサーバーを起動し, ホームページを閲覧出来るようにします.
Citation preview
MacBookでウェブサーバー ターミナルウィンドウ
コマンドラインインターフェース ホームページ作成 ウェブサーバー起動
溝 口 佳 寛 (九州大学 IMI) 2014年7月22日
ユーザーインターフェスコンピュータとユーザーの間で、情報をやり取りする為のインターフェース
• GUI(グラフィカルユーザーインターフェース)
• 入力としてキーボードやマウスといったデバイスを用い、ディスプレイ上にグラフィカルな出力を提示する方式。.
• 例:Windows、MacOS、UNIXでのX Window Systemなど
• CLI(コマンドラインインターフェース)、CUI(キャラクターユーザーインターフェース)
• ユーザがキーボードからコマンドを入力し、ディスプレイ上に文字を表示することで出力とする方式。(マウスは不使用)
• 例:UNIX(MacOSXでのターミナル)、MS-DOS(Windowsでのコマンドプロンプト)など
ターミナルを使ってCLIMacOSXでターミナル起動
「 アプリケーション ー> ユーティリティ ー> ターミナル 」と選択しターミナルを起動
コマンド一覧 ディレクトリ
ファイルを分類・整理する為の保管場所のことを、UNIX系OSにおいて、ディレクトリという。 ディレクトリには階層があり、木構造になっている。Windows、MacOSでは、同様の概念を 「フォルダ」 という。
コマンド(ファイル・ディレクトリ操作関連)
• ls (ファイルやディレクトリの情報を表示する)
• 構文: ls [オプション] [ファイル・ディレクトリ名]
• 例1:ls
• 例2:ls -al
• 例3:ls -al *.html
• 注意1:[ファイル・ディレクトリ名]が省略の場合は、「 . 」が入力されているのと同じ
• 注意2:「 . 」で現在のディレクトリ、「 .. 」で親ディレクトリを表す。
• pwd (現在のディレクトリを表示する)
• 構文: pwd [オプション]
• man (コマンドのマニュアルを表示する)
• 構文: man [オプション] [コマンド名]
• スペースキーで次ページ
• qで終了
• cd (ディレクトリを移動する)
• 構文:cd [ディレクトリ名]
• 例1:cd testdir (一つ下のtestdirに入る)
• 例2:cd .. (一つ上のディレクトリに上がる)
• 例3:cd ~
• 注意3:「~」でホームディレクトリを表す。
• mv (ファイルやディレクトリの移動、名前を変更する)
• 構文:mv [現ファイル・ディレクトリ名] [新ファイル・ディレクトリ名]
• 例:mv testdir testdir2
• cp(ファイル・ディレクトリのコピー)
• 構文:cp [オプション] [現ファイル・ディレクトリ名] [新ファイル・ディレクトリ名]
• 例:cp -R testdir 20140106html
• オプション「-R」はディレクトリをコピーする際に使用。
ターミナルでMathematicaファインダー内のアプリケーションフォルダは, ディレクトリは /Application です. アプリケーションフォルダ内のMathematicaアプリケーションの実体は,
/Application/Mathematica.app/Contents/MacOS/MathKernel
です. 実際にこのコマンドをターミナルから起動してみましょう. 式を入力して[Return]キーを押すと実行されます. 関数 Exit[] を実行すると終了します. [Ctrl]+Dキーの入力でも終了することが出来ます.
ウェブデータ(htmlファイル)の作成次のサンプルファイルをindex.htmlというファイル名でダウンロードします.
ダウンロードした index.html をダブルクリックするとSafariブラウザで整形されて表示されます.
index.html ファイルの編集は, UpTeXにドラッグ&ドロップしてeditで編集します.
例えば○×△■を自分の名前に変更してみましょう.
<html> <head> <meta http-equiv="content-type" content="text/html;charset=UTF-8"> <title> ○×△□のホームページ </title> </head> <BODY BGCOLOR="#ffffc0"> <font size=4> <h2> ○●□■のホームページ </h2> <a href="http://www.google.co.jp">googleへのリンク</a> <p> </body> </html>
ウェブサーバーの起動• 先のhtmlファイルの表示はブラウザはネットワークを経由せずに直接フォルダ内のファイルを表示しています. ツールバー内のURLの最初が file:/// で始まっていることに注意します. ネットワーク経由のウェブページのURLは http:// で始まります.
• ターミナルで sudo apachectl start とすることで自分のMacBookでウェブサーバーが起動します. sudoコマンドは管理者権限でコマンドを動かすときに使います. 管理者権限を確認するためにパスワードの入力が求められます. ネットワーク上での自分のホスト名は localhost となってます. Safari で http://localhost を開いて, ウェブサーバーが起動しているかどうかを確認します. “It woks!”と書かれたウェブページが表示されれば成功です. ウェブサーバーを終了するには, ターミナルで sudo apachctl stop を実行します.
フォルダの所有者(owner)の変更• 起動したウェブサーバーが参照するディレクトリは /Library/WebServer/Documents です. そこに自分で作ったhtmlファイルをコピーすれば自分で作ったウェブページを公開することが可能です. /Library/WebServer/Documents は所有者が root(管理者)になっているため, 個人が作ったファイルをコピーする際には管理者確認のパスワードを求められて面倒です. そこで, このディレクトリの所有者を自分に変更します.
• 自分のユーザ名を確認します. 自分のホームディレクトリ(~ チルダで指定)の所有者をls -ld ~コマンドで確認することでユーザ名を確認出来ます. ここでの例では[自分のユーザ名]は ym となっています.
• ディレクトリの所有者の変更は chown コマンドを使います. このコマンドの実行は管理者権限で行います. 従って sudo コマンドを使います.sudo chown [自分のユーザ名] /Library/WebServer/Documents/
自分のhtmlファイルをウェブサーバーで表示する• デスクトップにある自分で作成した index.html ファイルを /Library/WebServer/Documents/ にcpコマンドでコピーします. 最初に cd ~/Desktop でディレクトリを移動します.
• コピーしたウェブページが http://localhost で表示されることを確認します.
http://localhost で表示
MathematicaノートブックをWebページで保存する (1)• Mathematicaのノートブックを/Library/WebServer/Documents の下にWebページ(htmlファイル)として保存出来ます.
• ここでは物理シミュレーションの例 20140624haifu.nbをWebページで保存する例を示します.
• Mathematicaのファイルメニューから「別名で保存」を選択します.
• 保存先は Macintosh HD から、ライブラリ→WebServer→Documentでフォルダを指定します.
• ファイル名は何でも良いですが, ここでは 20140624haifu.html としています.
• ファイルのフォーマットは, Webページ(*.html)を選択して, 保存ボタンを押します.
MathematicaノートブックをWebページで保存する (2)
MathematicaノートブックをWebページで保存する (3)
保存されたウェブページはhttp://localhost/20140624haifu.html
で表示します.
IPアドレスを指定してWebページを見る• システム環境設定のネットワークメニューで, WiFi接続された自分のMacBookのIPアドレスを確認することが出来ます. (この例では, IPアドレスが, 192.168.1.4 であることが確認出来ます.)
• localhostの代わりにIPアドレスを使って接続すると, ネットワーク上の他のMacBookのWebページも見ることが出来ます. 例えばURLとして, http://192.168.1.4を指定します. 隣の友人のIPアドレスを聞いて試してみましょう.