締切済み

ホームページ作成についての質問です。

2010/07/14 15:30

ホームページ作成についての質問です。私は今メモ帳に直接HTMLをいれてホームページを作成しています。そのホームページにパスワードを設置したいんですが、ホームページ作成初心者なのでやり方がまったくわかりません。いきなり質問しては失礼なので、何日も検索しては試して、検索しては試して・・・と繰り返しました。でも、どんなページにも詳しいやり方が書いてあるんですが、意味がわからず、ちんぷんかんぷんです。そして今日やっと質問してみました。まったくの初心者なので、わかりやすいように説明していただけるとうれしいです＾＾よろしくお願いします＞＜

jack73500
お礼率0% (0/5)

HTML
回答数5
ありがとう数5

みんなの回答 （5）
専門家の回答

みんなの回答

yyr446
ベストアンサー率65% (870/1330)

2010/07/16 16:16 回答No.5

No.1です。javascriptによるページ認証をHTML5のWebストレージ機能を使ってを作ってみました。しょせんjavascriptですから、javascript をOFFにされるとどうしようもないですが。まず、ソースにパスワードをそのまま書くのはいくらなんでもまずいので、ハッシュします。下から、sha1ハッシュのJSを組み込みます。（別にこれじゃなくてもよいけど） http://pajhome.org.uk/crypt/md5/scripts.html 以下がトップページの例です（Authtest.htmという名前です） <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Auth test by WebStrage</title> <style type="text/css"></style> <script type="text/javascript" charset="UTF-8" src="/jslib/jshash-2.2/sha1-min.js"></script> </head> <body> <p><h3>Auth test by WebStrage</h3></p> <input type="password" id="password"></input> <button onclick="pwchk();">認証</button> <temp id="temp"></temp> <script type="text/javascript"> //document.getElementById("temp").innerHTML=hex_sha1("これこれ"); //4ad583af22c2e7d40c1c916b2920299155a46464 function pwchk(){ var password = "4ad583af22c2e7d40c1c916b2920299155a46464" var input_val = document.getElementById("password").value; if(hex_sha1(input_val)==password) location.href="/Authtok.htm"; else alert("パスワードが間違ってます。"); localStorage.password=input_val; } document.getElementById('password').value = localStorage.password; </script> </body> </html> 最初にコメントアウトされてるところを有効にして、「これこれ」をあなたのパスワードに変えて、ページを表示した結果表示されたパスワードのハッシュ値をvar password =の後ろに張り付けて下さい。その後コメントアウトの部分は削除しないと意味ないですよ。飛び先のページは（/Authtok.htm）です。ここで認証チェックして、NGなら、もとのページに飛ばします。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Auth test by WebStrage</title> <style type="text/css"></style> <script type="text/javascript" charset="UTF-8" src="/jslib/jshash-2.2/sha1-min.js"></script> </head> <body onload="authchk()"> <p><h3>Auth OK Page</h3></p> <script type="text/javascript"> function authchk(){ var password = "4ad583af22c2e7d40c1c916b2920299155a46464" if(hex_sha1(localStorage.password)!=password) location.href="/Authtest.htm"; } </script> </body> </html> このjavascriptを外部ファイルにして、sha1.jsと供に、各ページにインクルードしておけば、javascript認証もどきができるかな一応、IE7以上、Firefox3.6で試してOKでした。

metametamu
ベストアンサー率51% (153/295)

2010/07/16 03:39 回答No.4

パスワードってあってないようなものですか？(baccano!ですよね・・・) <input type="text" value="" id="ENTER"> <input type="image" src="image.jpg" alt="ENTER" onclick="document.getElementById('ENTER').value==='baccano!'&&(location.href='top.html')"> とりあえず形だけのわかる人にはすぐわかるソースです。難しいことは全くしていないのでjavascriptだけで動きます。 image.jpgの所にENTERボタンの画像、top.htmlの所に飛び先を入れてください。

質問者

補足 2010/07/16 14:32

文字を入力するところを、画像のようにする方法はないでしょうか？

noname#187541

2010/07/14 22:21 回答No.3

こんばんは。一番簡単なのは.htaccessでBASIC認証を使う方法です。ただし、サーバーが対応していればですが。(パスワードだけでなくIDも必要です。) .htaccessはいろいろな使い方があるので下記を参考にどうぞ。 http://www.shtml.jp/htaccess/

fujillin
ベストアンサー率61% (1594/2576)

2010/07/14 16:42 回答No.2

＞どんなページにも詳しいやり方が書いてあるんですが、＞意味がわからず、ちんぷんかんぷんです。ここの回答欄は文字数制限があるので、参照なさったページより詳しいどころか、もっと簡単な回答しかできないと思います。どのような方法をしようとして何が分からないか、もっと限定した質問にしないと、漠とした質問では回答があってもやはり意味がわからないのではないでしょうか？たいていのページはここで回答するよりも充実しているので… 　http://www.atmarkit.co.jp/flinux/rensai/apache10/apache10a.html 　http://ja.wikipedia.org/wiki/Basic%E8%AA%8D%E8%A8%BC 　http://www.atmarkit.co.jp/flinux/rensai/linuxtips/698apachebasic.html