2016年05月24日 情報科学類 コンピュータリテラシ 筑波大学 システム情報系 情報工学域 新城 靖 <yas@cs.tsukuba.ac.jp>
このページは、次の URL にあります。
http://www.coins.tsukuba.ac.jp/~yas/coins/literacy-2016/2016-05-24
あるいは、次のページから手繰っていくこともできます。
http://www.coins.tsukuba.ac.jp/~yas/
http://www.cs.tsukuba.ac.jp/~yas/
HTML で記述できる文書の構造:
表示の方法:
<HTML> <HEAD> <META HTTP-EQUIV="content-type" CONTENT="text/html;charset=iso-2022-jp"> <TITLE>スタイルシートの例題:タグへの設定</TITLE> <STYLE TYPE="text/css"><!-- H1 { color: blue; } --></STYLE> </HEAD> <BODY> <H1>青いH1の見出し</H1> <H2>普通のH2の見出し</H2> </BODY> </HTML>[表示例]
(1) HTML のヘッダ
<HTML> <HEAD> <TITLE>タイトルです。</TITLE> <STYLE TYPE="text/css"><!-- (ここにスタイルシートを書く) --></STYLE> </HEAD>
(2) 別のファイル
「スタイルシートのURL」は、filename.css
のようなファイル名が多い。
<HTML> <HEAD> <TITLE>タイトルです。</TITLE> <LINK rel="stylesheet" type="text/css" href="スタイルシートのURL"> </HEAD>
<HTML> <HEAD> <TITLE>タイトルです。</TITLE> <STYLE TYPE="text/css"><!-- @import url(スタイルシートのURL); (別ファイルに加えてここにもスタイルシートを書くことができる) --></STYLE> </HEAD>
(3) HTML のタグの属性
<P STYLE="color:blue">文。文。文。</P>
/*
と */
で括った部分がコメントとなる。
この表記法法は、C言語やJava言語と似ている。
(他の言語では、この表記法は使えないことがある。)
コメントは、デバッグ時など一時的に
コンピュータ言語の機能を無効にしたい時にも使える。
セレクタ { 宣言; } セレクタ, セレクタ, ..., セレクタ { 宣言;宣言;宣言; }1つひとつの宣言は、次の形式。
プロパティ:式「式」には、数、文字列、%、単位つきの長さ、URL などが書ける。
H1 { color: blue; }
#n10 { color:blue; } /* id="n10" と指定したものだけ */ ... <H1 id="n10"> .... </H1>
<HTML> <HEAD> <META HTTP-EQUIV="content-type" CONTENT="text/html;charset=iso-2022-jp"> <TITLE>スタイルシートの例題:クラスの利用</TITLE> <STYLE TYPE="text/css"><!-- .important { color:red; } /* class="important" と指定したものだけ */ --></STYLE> </HEAD> <BODY> <H1>普通のH1の見出し</H1> <P> 普通のパラグラフ </P> <P class="important"> 重要なパラグラフ </P> <H2>普通のH2見出し</H2> <H2 class="important">重要な普通のH2見出し</H2> <P> 普通の言葉。<SPAN class="important">重要な言葉。</SPAN>普通の言葉。 </P> </BODY> </HTML>[表示例]
注意点
CSSのクラスは、しばしば <DIV>タグや<SPAN>タグとともに利用 される。
H1 { color: blue; }
H1 { color: #0000ff; }
http://www.w3.org/TR/html40/types.html
参照。
HTML ではできないが、CSSでは、次の方法も有効。
H1 { color: rgb(0,0,255); }/* 0 から 255 */
H1 { color: rgb(0%,0%,100%); }/* 0% から 100% */
http://www.tohoho-web.com/css/,とほほのスタイルシート入門
http://www.w3.org/Style/CSS/,W3C Cascading Style Sheets home page
(http://www.a2ztutorial.com/Style/CSS/,日本語
)
http://jigsaw.w3.org/css-validator/,W3C CSS Validator
http://validator.w3.org/,W3C HTML Validator
図? アクセス制御における主体、オブジェクト、および、操作
アクセス制御のオブジェクトは、ファイル、または、プロセスである。 操作には、次のようなものがある。
図? 実世界のユーザとUNIX中のプロセス・ファイル
Unixでは、全てのファイルやプロセスは、あるユーザの所有物である。 ファイルとプロセスには、UID が付加されている。
1人のユーザが複数のグループに属することができる。
whoami
コマンドを用いる。
$ whoami
yas
$
この例では、この人(のプロセス)のユーザ名は、yas
。
プロセスが属しているグループのグループ名を調べるには、
groups
コマンドを用いる。
$ groups
ugrad _developer netaccounts everyone com.apple.sharepoint.group.1
$
この例では、この人(のプロセス)は、
ugrad
, _developer
, netaccounts
everyone
,
com.apple.sharepoint.group.1
,
という5つ
のグループに属している。
idコマンドも使える。
$ id
uid=1013(yas) gid=530(ugrad) groups=530(ugrad),204(_developer),62(netaccounts),12(everyone),402(com.apple.sharepoint.group.1)
$
$ ls -l ~/.bashrc
-rw-r--r-- 1 yas prof 450 4 8 16:14 /home/prof/yas/.bashrc
$ ls -ld ~
drwxr-xr-x 54 yas prof 7168 5 19 14:12 /home/prof/yas
$
この例では、UID 属性が yas、GID 属性が prof である。
ファイルの「内容」のアクセス3段階であるが、ファイルの「属性」次の2段 階である。
(ホームディレクトリ以下の)ディレクトリの x を使ったファイルへの読み込み アクセスの許可と禁止。
図? ディレクトリのxの働き
スーパー・ユーザ(super user)
は、UID が 0 。
特権ユーザ(privileged user)、
ルート(root)、
su
(su コマンド、あるいは super user の略)ともよばれる。
スーパーユーザのユーザ名は、慣例として
root
という文字列が使われる。
ファイルのバックアップなど、システム管理の作業には スーパー・ユーザの仕組みが必要になる。
chown
コマ
ンドを用いる。ただし、スーパーユーザの権限が必要である。
ファイルをコピーして、元ファイルを消すことはできる。
ファイルの GID 属性を変更するには、chgrp
コマンドを使う。
一般ユーザは、自分が属しているグループにのみ変更できる。
任意のグループに変更するには、スーパー・ユーザの権限が必要である。
$ ls -l file1.txt
-rw-r--r-- 1 yas prof 2 5 10 18:59 file1.txt
$ chmod go-r file1.txt
$ ls -l file1.txt
-rw------- 1 yas prof 2 5 10 18:59 file1.txt
$
file1に対して、グループ(g)とそれ以外の人(o)に対して「読込み可」の許可を
取り除いている。
chmodは一般的には次の形式で実行する。
$ chmod set file1 file2 ...
set の形式
[ugoa][=+-][rwx]
ここの[ugoa]は、誰に対するアクセスの設定を変更するかを対象となる人を以
下の表から選んで並べる(複数可)。
文字 | 単語 | 意味 | |
u | user | ユーザ(利用者,所有者) | |
g | group | グループ | |
o | others | その他 | |
a | all | 全員、ugo と同じ |
文字 | 意味 |
+ | 許可を追加する |
- | 許可を除く |
= | 指定した許可だけとする |
文字 | 単語 | 意味 |
r | read | 読込み可 |
w | write | 書込み可 |
x | execute | 実行可 |
X | execute | 実行可(所有者に対して「実行可」がある時だけ) |
chmod には、-R (recursive)オプションがある。 これは、ディレクトリをたぐり全部変更することを意味する。
rw-r--r--
rwxr-xr-x
rwxr-xr-x
rwx------
rw-r--r--
~/public_html
以下のファイル)
rwxr-xr-x
public_html
以下のディレクトリ)
rwxr-xr-x
または rwx--x--x
~
。~/public_html
の親ディレクトリ)。
x ビットを出す。
rw-rw-r--
または rwxrwxr-x
r-xr-xr-x
, r-x------
~/.forward
というファイルに、転送先のアドレスを書く。
たとえば、
shiro@himalaya.is.tsukuba.ac.jp
に届いたメールを全て
shiro@alps.is.tsukuba.ac.jp
に転送したいとする。この時、
himalaya
の方のホーム・ディレクトリの下の
~/.forward
に次のように書く。
shiro@alps.is.tsukuba.ac.jp単純に転送先のアドレスを書く方法では、
~/.forward
が
あるホストには、何も残らないが、コピーを残しながら、転送する方法もある。
それには、次のように自分のログイン名に\
を付けたア
ドレスを含める。
\shiro, shiro@alps.is.tsukuba.ac.jp注意:「
\
」は、ASCII 「5c(16進数)」である。
「\」と表示されたり「¥」と表示されることがある。
「/」ではない。
この例では、himalaya に届いた電子メールは、himalaya
と
いうホストの
\shiro
というユーザの
配送プログラム用メール・ボックスに入り、
さらに、shiro@alps.is.tsukuba.ac.jp
にも送られる。
alps
にログインした時にも、
alps
と himalaya
の両方のメールが読め、
また、himalaya
にログインしてもやはり
alps
と himalaya
の両方のメールが読める
と便利に思えるかもしれない。しかし、こうすることは技術的に難しいので、
しばらくはあきらめて欲しい。
\loginname
の機能をつかっても、なかなかうまくいかない。
たとえば、次のよう
な ~/.forward
を作成したと考える。(実際に実行すると危険なので、
考えるだけする。)
(alps:~/.forward) \shiro, shiro@himalaya.is.tsukuba.ac.jp
(himalaya:~/.forward) \shiro, shiro@alps.is.tsukuba.ac.jpこの状態で、
shiro@alps.is.tsukuba.ac.jp
にメールが届いた
場合、次のようなことが起る。
alps
にコピーが残され、かつ、
shiro@himalaya.is.tsukuba.ac.jp
に送らる。
himalaya
では、やはり、コピーが残され(ここまでは順調)、
さらに、shiro@alps.is.tsukuba.ac.jp
に送られる(!)。
alps
では、コピーが残され(2回目)、himalaya
に送られる。
himalaya
では、コピーが残され(2回目)、
さらに、shiro@alps.is.tsukuba.ac.jp
に送られる。
alps
では、コピーが残され(3回目)、himalaya
に送られる。
himalaya
では、コピーが残され(3回目)、
さらに、shiro@alps.is.tsukuba.ac.jp
に送られる。
alps
では、コピーが残され(4回目)、himalaya
に送られる。
himalaya
では、コピーが残され(4回目)、
さらに、shiro@alps.is.tsukuba.ac.jp
に送られる。
3ヵ所以上でこの設定をしたとすると、中継される度にメールが増殖する。
\loginname
の機能を使っていなかったとすると、コピーは
残らないが、メールが行き来するだけで、どこにも届けられずにエラーになる。
~/.forward
の設定をしたら、必ず自分で自分あてに電子メールを出
して届くかテストすること。~/.forward
の設定を間違えると、エラー
のメールも届かなくなるので、エラーが起こっていることさえわからなくなる。
~/.forward
の機能は、もともとは、sendmail という種類のMTA の機
能である。他の MTA (qmail, postfix)でも使えるように設定していることが多い。
次のようにして、「ことえり」の設定を確認しなさい。そして、キーボードの 「¥」でバックスラッシュが入力されるように設定しなさい。
coins 以外に日常的に読み書きするメール・アカウントがある人は、毎日 coins に届いたメールを確認する方法として~/.forward を設定して、転送する 方法が考えられる。そのようにしたい人は、そうしなさい。
~/.forward は、emacs でテキスト・ファイルとして作成するとよい。
$ emacs ~/.forward
$ cat ~/.forward
\s1654321, myaddr@xxx.yyy.zzz
(これは一例なので真似しないように)
$
設定が完了したら、必ず自分自身の coins のアドレス
(例えば学生番号が 201654321 なら
s1654321@coins.tsukuba.ac.jp
)にメールを書き、次のことを
確認しなさい。
http://www.coins.tsukuba.ac.jp/ce/,学類コンピューティング環境
のページ
を開く
"skin/pukiwiki_gs2.css.php?charset=Shift_JIS&gs2color="
)
http://www.coins.tsukuba.ac.jp/ce/
に
"skin/pukiwiki_gs2.css.php?charset=Shift_JIS&gs2color="
を合わせて
http://www.coins.tsukuba.ac.jp/ce/skin/pukiwiki_gs2.css.php?charset=Shift_JIS&gs2color=
となる。
$ lv ~yas/public_html/htdocs/coins/literacy-2016/2016-05-24/blue-h1.html
<STYLE TYPE="text/css"><!-- H1 { color: blue; } --></STYLE>この記述を、自分自身が作成した HTML ファイルに含めてみなさい。 自分自身が作成した HTML ファイルで、H1 タグを使っていない人は、 他のタグを変更しなさい。
$ lv ~yas/public_html/htdocs/coins/literacy-2016/2016-05-24/important.html
<STYLE TYPE="text/css"><!-- .important { color:red; } /* class="important" と指定したものだけ */ --></STYLE>この記述を、自分自身が作成した HTML ファイルに含めてみなさい。 さらに、次のように、タグに class 属性を加えてみなさい。
<P class="important"> ... <H2 class="important">重要な普通のH2見出し</H2> ... <SPAN class="important">重要な言葉。</SPAN>
$ id
$ whoami
$ groups
$ echo ~
$ ls -ld /
$ ls -ld /home
$ ls -ld /home/ugrad/
・・・中略・・・
$ ls -ld ~
ディレクトリ ~/public_html, ~/public_html/htdocs や ~/public_html/index.html のモードを調べな
さい。
$ ls -ld ~/public_html
$ ls -ld ~/public_html/htdocs
$ ls -l ~/public_html/htdocs/index.html
他の人(WWWページとして公開するために、WWWサーバ・プロセスからのアクセ
スも含む)がアクセスしようとしたらどうなるかを考察しなさい。
その他に、次のファイルやディレクトリのモードを調べなさい。
$ cd ~yas
$ ls -l
$ ls -l literacy-a*
$ lv literacy-a2.txt
$ lv literacy-a3.txt
$
$ cd ~yas
$ ls -l
$ ls -l literacy-a*
$ lv literacy-a4.txt
$ lv literacy-a5.txt
$
$ ls -l file1.txt
-rw-r--r-- 1 yas prof 2 5 10 18:59 file1.txt
$ chmod go-r file1.txt
$ ls -l file1.txt
-rw------- 1 yas prof 2 5 10 18:59 file1.txt
$
go-r
を含めて、様々なモードの設定方法がある。
次の設定方法の意味を確認しなさい。
WWW ページとして公開するファイルのモードはその他(others)に対するアクセ ス許可で r ビットが立っている必要がある。もし、このビットを chmod o-r で落した場合、Web ブラウザでアクセスできなくなる。このことを確かめなさ い。
$ cp sample1.html sample2.html
<アクセス制御のテスト用のファイルを cp コマンドで作成する。>
$ ls -l sample2.html
-rw-r--r-- 1 yas prof 408 5 18 11:11 sample2.html
<Firefoxでアクセス、再読み込み等>
$ chmod o-r sample2.html
$ ls -l sample2.html
-rw-r----- 1 yas prof 408 5 18 11:11 sample2.html
<Firefoxでアクセス、再読み込み等>
$ chmod o+r sample2.html
$ ls -l sample2.html
-rw-r--r-- 1 yas prof 408 5 18 11:11 sample2.html
<Firefoxでアクセス、再読み込み等>
$
同様に、ディレクトリを作成し、その他(others)に対する x ビットを立てたり 落したりしながら、その効果を確認しなさい。
$ cd ~/public_html/htdocs
$ mkdir dir1
$ emacs dir1/file1.html
$ ls -ld dir1
$ ls -l dir1/file1.html
<Firefoxでアクセス、再読み込み等>
$ chmod o-x dir1
$ ls -ld dir1
<Firefoxでアクセス、再読み込み等>
$ ls -l file1.txt
(ファイルのグループの表示)
$ id
(自分(プロセス)が属しているグループの表示)
$ chgrp グループ file1.txt
$ ls -l file1.txt
(ファイルのグループの表示)
$
まず、適当な内容を持つテキスト・ファイルを作成しなさい。
$ echo hello > file1
$ ls -l file1
-rw-r--r-- 1 yas prof 6 5 23 22:28 file1
$ cat file1
hello
$
そして、次のような要求を満たすように chmod コマンドを使ってモードを変更
しなさい。提出するファイルには、chmod コマンドをどのように利用したか、
また、その結果 ls -l の表示がどのようになったかを含めなさい。
$ ls -ld dropbox
drwx-wx-wx 2 yas prof 80 5 19 15:28 dropbox
$
送信側は、受信者が読めるモードで、ファイルを作成し、受信者の drop box
ディレクトリの下にコピーする。
$ emacs file-2016-05-24.text
$ ls -l file-2016-05-24.text
-rw-r--r-- 1 yas prof 56353 5 19 15:38 file-2016-05-24.text
$ cp file-2016-05-24.text ~user/dropbox
$
送信者は、このディレクトリから目的の取り出す。cp コマンド等でファイルを
コピーし、元のファイルを rm コマンド等で削除する。
このような drop box を用いて、隣の人、あるいは、その他の友人にファイルを渡しなさい。 同様に、ファイルを受け取りなさい。
$ ls -l file-2016-05-24.text
-rw-r--r-- 1 yas prof 56353 5 19 15:38 file-2016-05-24.text
$ cp file-2016-05-24.text ~
$ rm file-2016-05-24.text
注意: Mac OS X では、このディレクトリは標準で ~/Public/Drop
Box
という名前のディレクトリを用いる。名前に空白が含まれていることに注
意しなさい。このディレクトリの使い方は、次のページに書かれている。
http://support.apple.com/kb/PH13775,Share files using a drop box
http://support.apple.com/kb/PH13775?viewlocale=ja_JP,ドロップボックスを使用してファイルを共有する
~/Public/Drop Box
は、自動的には作
成されない。この練習問題では、このディレクトリを用いても良いし、他の名
前のディレクトリでもよい。
注意: この練習問題では、
インターネット上のファイル・サービス
https://www.dropbox.com/
を用いない。
他の人へのアクセスを防ぐ方法として、ファイル名に乱数(予測されない文字 列)を含める方法がある。この方法を練習してみなさい。
なお、cp コマンド等でコピーした場合には、ps コマンドで引数が表示される ことがある。このことを確認しなさい。ファイル名を秘匿してdrop box に書き 込む時には、ps で表示されない方法を使う必要がある。その方法を考えなさい。
/tmp
など、誰でも書き込みできる場所にファイルを作成すると、その
ファイルの UID 属性はどうなるか調べなさい。新たに実験用のディレクトリを
mkdir コマンドで作成しなさい。そのディレクトリのGID属性を chgrp で変更
し、その中に新たなファイルやディレクトリを作成したら、その GID がどう設
定されるかを確かめなさい。また、既存のファイルをmv コマンドで移動したら
どうなるかを調べなさい。
以下の問題、および、回答をテキスト・ファイルに記述し、 レポート提出ページから提出しなさい。
(1) 電子メールの転送について、当てはまる行の先頭に yes, 当てはまらない 行の先頭に no と記述しなさい。
(a) coins 以外に電子メールのアカウントがある。 (b) coins のメールを毎日読む。 (c) ~/.forward の機能を理解した。 (d) ~/.forward を設定した。~/.forward を設定した人は、その内容を insert-file 等でレポートに含めなさい。 練習問題 .forwardの設定と確認 参照。
(2) 情報科学類の学生は、coinsに届いたメールを毎日確認する必要がある。あ なた自身がどのようにして毎日確認するかを書きなさい。
(3) 自分のホーム・ディレクトリとその下にあるファイルについて、次のこと を行いなさい。
$ ls -ld ~
$ cd ~
$ ls -l file524.txt
-rw-r--r-- 1 s1654321 ugrad 4 5 20 10:43 file524.txt
$
このファイルを、coins の「他の利用者」が cat コマンドで読み出そうとした
時に何がおきると考えられるか。簡単に答えなさい。(実際に他の利用者に試
してもらって良い。考えるだけで実際には試さなくても良い。)
(他の人の操作)
$ cd ~s1654321
$ ls -l file524.txt
-rw-r--r-- 1 s1654321 ugrad 4 5 20 10:43 file524.txt
$ cat file524.txt
(他の人の操作)
$ cd ~s1654321
$ ls -l file524.txt
-rw-r--r-- 1 s1654321 ugrad 4 5 20 10:43 file524.txt
$ emacs file524.txt
調べるには、ls -l コマンドとlv コ マンド、grep コマンドを使う方法もある。
$ ls -l | lv
$ ls -l | grep rw-r--r--
(他の人の操作)
$ cd ~s1654321
$ cat file524.txt
cat: file524.txt: Permission denied
$
ただし、自分自身は、読み込みもでき、書き込みもできる状態を保ちたい。最
終的には、どのようなモードになるか。ls -l の表示の形式で答えなさい。
(r,w,x,-
の9文字で答えなさい。)
$ chmod 回答
$ ls -l file524.txt
(確認)
$
(4) HTML と CSS で次のような条件を満たす WWW ページを作成しなさい。
練習問題 スタイルシートの記述(タグ)、 練習問題 スタイルシートの記述(クラス)参照
(5) The Unix Super Text の次の部分を読みなさい。
(6) [加点] (6) で、このページの説明の範囲を超えたスタイルシートの機能を 3つ以上、利用しなさい。そして、各機能の説明、どこに利用しているか、およ び、その機能の有用性を書きなさい。( CSSの利用 例や、その他のCSSの利用例で紹介されてい るものを利用してもよい。)
(9) [加点] 練習問題 mkdirとchmodによる drop box ディレクトリの実装(2)を行いなさい。次の結果をレポートに含めなさい。
注意: この課題で用いるものは、
インターネット上のファイル・サービス
https://www.dropbox.com/
を用いるものではない。