ログインしてさらにmixiを楽しもう

コメントを投稿して情報交換!
更新通知を受け取って、最新情報をゲット!

Webデザインコミュの疑似ログイン画面のページを作るにはどうしたらいいでしょうか。

  • mixiチェック
  • このエントリーをはてなブックマークに追加
計画をたてている段階で、
シンプルな仮のウェブサイトを作っています。

まだまだ知識がないもので、今回はデータベースを作らず
Flashを使わずになんとかできないものかと悩んでいます。

ユーザネームとパスワード欄に何かしら入力して
「ログイン」ボタンを押せばログイン後の画面に移動できるようにする方法はありますでしょうか?

初心者の質問で申し訳ありませんが、ご教授頂けますと嬉しいです。

どうぞ宜しくお願いいたします!

コメント(15)

せっかくこういうトピがあるので、↓へどうぞ。
http://mixi.jp/view_bbs.pl?id=64538710
タクロ さま

アドバイスありがとうございます。そちらは「Web技術用」とのことでしたので、ログイン画面については別にしたほうが分かりやすいかと思ったのですが、いかがでしょうか?
のち'' さま

はじめまして、コメントありがとうございます。
フォームを使う事はまったく考えつきませんでした!
丁寧に例までつけて教えて下さりありがとうございます。

ユーザ名、パスワードの入力欄と、何を入力しても
ログイン先に飛べるようなフォームを
どのように作れるか、調べてみます!
基本認証ってやつで済みそうな話ですね。
.htaccessだけでできますから下記を参照してやってみてください
http://allabout.co.jp/gm/gc/23780/
TAKE667 さま

アドバイスありがとうございます。とても助かります。

基本認証というものについてすこし調べてみたのですが、
ログインページというよりは、ダイアログボックスが出てしまうという印象です。

ですがもしこれをウェブサイトのトップページ自体に埋め込むような事ができれば
今回の目的にはとても便利に使えそうです!

もうすこし調べてみます。ありがとうございます!
核爆発 さま

コメントとアドバイスありがとうございます。

今回は、実際にログインしているように見える
(適当なユーザネームとパスワードを入力し、次のページに
飛べるリンクを作れればと考えています)ようにしたいのですが、
その場合もそのような仕組みを作る必要があるのでしょうか?あせあせ(飛び散る汗)
初めまして。

ログイン処理を入れておかないと、ログイン後のページを直接指定されると誰でも見れてしまいます。
つまり、>>2の例で言えば「login_go.html」のファイルを直接指定すれば見れてしまいます。

今回のログイン画面はあくまで仮で、別に直接ログイン後の画面を指定されたら見られてもいいなら問題ありませんが、ログインしていないなら見れないようにするならば、>>5のBASIC認証を使うと簡単にガードできます。
BASIC認証を使わず、自前で行うならログイン後のページを直接指定されたときに現在ログイン中であるかどうかをチェックしてログインされていなければログイン後の画面が見れない(ログインページに強制的に遷移させるなど)の処理が必要になります。
今回は仮、ということでJavascriptでいいんじゃないでしょうか?
formのaction先を遷移先のページにして、んで、送信ボタンが押された時に(onSubmitされた時に)、何かしらのチェック用の関数に飛ぶようにし、フォーム要素のIDとパスワードが指定の内容であれば、return trueし、そうでなければ"パスワードが不正です。"とでもalertさせて、return falseするというので十分じゃないでしょうか?

もちろん、皆様がおっしゃるように、サーバサイドの処理だったり、BASIC認証だったり、いろんなやり方がございますが、今回の要件が
1.HTML上の入力フォームに入力させ特定の値の時、指定ページに飛ばす
2.あくまで仮のものなのでデータベース等と連動しない
ということであれば、その程度で十分なように思います。
Kent さま

お返事有り難うございます。

ご指摘の通り、今回は見た目状、ログインしたような形にする事を
目標にしていますので、リンク先に飛べる事は心配していません。
実際のウェブサイトを作るときまでにもっと勉強しないと、とあらたに気合が入りました。
とても参考になるご意見とアドバイス、ありがとうございます!
。ちふみん=¢いわさ さま

コメント有り難うございます!
はずかしながら、ド素人なのでJavaScriptを使うとなると
一から勉強しなければならないので、今の所
(実際になんとなく構造のわかる設計図のような状態です)は、
何も入力しなくても入れてしまう状態で形だけ作ってみようと思います。

そこで、ここまで皆様に助けて頂き自分でも色々と調べてみて、
2 で のち'' さまがコメントを下さったように、
フォームのみでなんとかしてみたいな、と思っている所です。
(^に追記です。)

実際にウェブサイトを作る段階までに、少しずつJavaScriptの勉強もしようと思います。
かさねて、ご助言ありがとうございます!
みさりぬ(南極生活) さま

アドバイス有り難うございます!

内容に関しまして、おっしゃる通りです。
アドバイスの通り、すっきりしたフォームができましたら、
ボタン部分に直接リンクを貼ってみます!

ありがとうございます。

---------------------------------------------------------------------------
最初のトピック文章の書き方が曖昧でご迷惑をおかけしました。
にもかかわらず沢山の方々に助けて頂いて、とても感謝しています。

ログインすると、みんなのコメントがもっと見れるよ

mixiユーザー
ログインしてコメントしよう!

Webデザイン 更新情報

Webデザインのメンバーはこんなコミュニティにも参加しています

星印の数は、共通して参加しているメンバーが多いほど増えます。