#ffffff #bc7c43 #beb53f #85a248 #2f6850 #4f8ea4 #89bcc5 #565669 #000000 #b22222 #daa09a

web material *Essence

  1. Home
  2. DesignTips
  3. OtherTips › access

Simple access restriction

簡易アクセス制限

秘密のページへリンクする

パスワードを入力すると、パスワードを知っている人だけが入室できるページへリンクします。
ページのファイル名がパスワードになっているので、アクセスして欲しい人にだけ見てもらえます。
またパスワード名 + html にリンクするので、ページを複数作成して振り分けする事もできます。
javascriptを使った小技ですが、あくまでも簡易的なものなので、もっと確実なアクセス制限をかける場合はcgiや.htaccess等を利用して下さい。


<form name="passform">
<input type="password" name="psw">
<input type="button" value="認証" onclick="Passpage();">
</form>
例1:

↑abc または 123 と入れて下さい。

例でリンクしたページは abc.html、123.html、パスワードで入力したページが開きます。
上記のソースの場合は同じディレクトリ(階層)にページが置いてある場合ですが、別のディレクトリに有る場合は

location.href="../"+pwd+".html"; (topのディレクトリに有るページ)
location.href="../フォルダ名/"+pwd+".html"; (別のディレクトリに有るページ)
location.href="フォルダ名/"+pwd+".html"; (同じディレクトリの別フォルダに有るページ)

のように書き換えて下さい。

パスワードのページを別窓で開く

リンクするページを別窓で表示したい場合は下記のように変更して下さい。


<form name="passform">
<input type="password" name="psw">
<input type="button" value="認証" onclick="Passpage();">
</form>
例2:

↑abc または 123 と入れて下さい。
ページは戻れないので×で閉じて下さい。

features の部分は、ウィンドウのサイズなどの複数のパラメーターを指定できます。
(例2では"width=500,height=400"を指定しています。""のように何も入れなければ通常のウィンドウを開きます。)

ウィンドウのパラメーターについては、DesignTipsの『ウィンドウを開く・閉じる』のページをご参照下さい。