2017-02-03 21 views
0

は私がローカルで実行しているウェブアプリのこのスクリーンショットを見てみてください間違ったエントリを表示するエラーメッセージを取得する:ユーザー登録フォーム - だけ

enter image description here

ご想像の通り、何をI私がやろうとしているのは、ユーザーが困ったときにエラーメッセージを作成することです。 - それは、ない3〜20文字のある、スペース文字が含まれているおよび/または

  1. ユーザーが
  2. ユーザ名が無効であるユーザ名を入力しません:エラー・メッセージをトリガするための5つのパラメータがあります。 0〜9の文字が含まれています
  3. パスワードは無効です - 3〜20文字ではありません
  4. パスワードが一致しません - パスワードの確認'は「パスワード」と同じではありません
  5. 電子メールが無効です - (r'^[\S][email protected][\S]+\.[\]+$')と一致する必要があります。 ers、@記号、文字の束、期間、および文字の束。

ご覧のとおり、私のコードでは、ユーザーが「送信」をクリックした後ではなく、ページが読み込まれたときにエラーメッセージが表示されています。

here(私のホスティングサービス、HostGatorはWebApp2をサポートしていないため、Google Cloudにリポジトリをアップロードできませんでした)の理由で、このWebアプリケーションをWebサイトでホストできませんでした。

これらのファイルを(おそらくGoogle App Engine経由で)ローカルでテストする必要があります。私はフレームワークを使用することはできませんよ除い

https://github.com/user3546086/user-signup

#!/usr/bin/env python 
# 
# Copyright 2007 Google Inc. 
# 
# Licensed under the Apache License, Version 2.0 (the "License"); 
# you may not use this file except in compliance with the License. 
# You may obtain a copy of the License at 
# 
#  http://www.apache.org/licenses/LICENSE-2.0 
# 
# Unless required by applicable law or agreed to in writing, software 
# distributed under the License is distributed on an "AS IS" BASIS, 
# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or 
# implied. 

# See the License for the specific language governing permissions and 
# limitations under the License. 
# 
import webapp2 
import cgi 

def Build_Page(textarea_content): 

form = """ 
<table> 
    <tr> 
    <td> 
    <label>{0}</label> 
    </td> 
    <td> 
    <label>Username: <input type="text" name="username"/></label> 
    </td></tr> 

    <tr> 
    <td> 
    <label>{1}</label> 
    </td> 
    <td> 
    <label>Password: <input type="text" name="password"/></label> 
    </td></tr> 

    <tr> 
    <td> 
    <label>{2}</label> 
    </td> 
    <td> 
    <label>Verify Password: <input type="text" name="verify_password"/> 
    </label> 
    </td></tr> 

    <tr> 
    <td> 
    <label>{3}</label> 
    </td> 
    <td> 
    <label>Email (optional): <input type="text" name="email"/></label> 
    </td></tr> 

    </table> 
    """ 
    submit = "<input type = 'submit'/>" 
    form2 = ("<form method='post'>" 
     + form + submit + "</form>").format("Please enter a valid 
    username", "Please enter a valid password", "Your passwords must 
    match", "Please enter a valid email") 

    header = "<h1>User Signup</h1>" 

    return header + form2 

class MainHandler(webapp2.RequestHandler): 
    def get(self): 
    content = Build_Page("") 
    self.response.write(content) 

    def post(self): 
    # look inside the request to figure out what the user typed 
    username = self.request.get("username") 
    password = self.request.get("password") 
    verify_password = self.request.get("verify_password") 
    email = self.request.get("email") 
    # if the user typed nothing at all, redirect 
    if (not username) or (username.strip() == ""): 
     error = "Please enter a valid username." 
     self.response.write(error) 
     self.redirect("/?error=" + cgi.escape(error, quote=True)) 

    if (not password) or (username.strip() == ""): 
     error = "Please enter a username." 
     self.response.write(error) 
     self.redirect("/?error=" + cgi.escape(error, quote=True)) 

    """if (not username) or (username.strip() == ""): 
     error = "Please enter a username." 
     self.response.write(error) 
     self.redirect("/?error=" + cgi.escape(error, quote=True)) 

    if (not username) or (username.strip() == ""): 
     error = "Please enter a username." 
     self.response.write(error) 
     self.redirect("/?error=" + cgi.escape(error, quote=True))""" 

    #    self.write.form2  
    #message = self.request.get("message") 
    # hello</textarea>hello 
    #rotation = int(self.request.get("rotation")) 
    # 0 
    #encrypted_message = caesar.encrypt(message, rotation) 
    # hello</textarea>hello 
    #escaped_message = cgi.escape(encrypted_message) 
    # hello&lt;/textarea&gt;hello 
    #content = build_page(escaped_message) 
    #self.response.write(content) 

    #originalform = form.format("","","","","","") 
    #page footer 

    #class TestHandler(webapp2.RequestHandler): 
    # """ Handles requests coming in to '/add' 
    #  e.g. www.user-signup.com/add 
    # """ 
    # def get(self): 

app = webapp2.WSGIApplication([ 
    ('/', MainHandler), 
    #('/', TestHandler) 
], debug=True) 

はまたここで、いわゆる溶液でビデオだ:ここでは、ファイル、main.pyのための私のGitHubリポジトリへのリンクとコードです彼がこのプロジェクトに使っているように。

https://www.youtube.com/watch?v=wHtUNPslte4

私は彼が私のMainHandlerクラス内のポスト機能で行ったように「のparams」変数を作成しようとしましたが、何も起こりません。だから私のMainHandlerクラスは次のようになります:

class MainHandler(webapp2.RequestHandler): 
def get(self): 
    content = Build_Page("") 
    self.response.write(content) 

def post(self): 
    # look inside the request to figure out what the user typed 
    have_error = False 
    username = self.request.get("username") 
    password = self.request.get("password") 
    verify_password = self.request.get("verify_password") 
    email = self.request.get("email") 

    params = dict(username = username, 
        email = email) 

    # if the user typed nothing at all, redirect 
    if (not username) or (username.strip() == ""): 
     #error = "Please enter a valid username." 
     #self.response.write(error) 
     #self.redirect("/?error=" + cgi.escape(error, quote=True)) 
     params['error_username'] = "Please enter a valid username." 
     have_error = True 

    if (not password) or (password.strip() == ""): 
     #error = "Please enter a username." 
     #self.response.write(error) 
     #self.redirect("/?error=" + cgi.escape(error, quote=True)) 
     params['error_password'] = "Please enter a valid password." 
     have_error = True 

    if have_error: 
     self.render('signup-form.html', **params) 
    else: 
     self.redirect('/unit2/welcome?username=' + username) 

そしてコード内の他のものはすべて同じように見えます。私が指定したと思ったように、パラメタが満たされていないときにエラーメッセージが表示されない理由を確かめてください。できる場合はお手伝いください、ありがとうございます。

答えて

1

まず最初に、エラーメッセージがテキストボックスの左側に表示されます。これは、そのテキストボックスがテーブルに配置されているためです。文字列置換を行うと、ユーザーが間違って入力したときにラベルの右側にメッセージが表示されます。だからあなたのテーブルには、次のようになります。

import webapp2 
import cgi 
import re 

form = """ 
<h1>User Signup</h1> 
<form method = "post"> 
<table> 
<tr> 
<td> 
<label>Username: <input type="text" name="username"/></label> 
</td> 
<td> 
<label style="color:red">{username_message}</label> 
</td> 
</tr> 

<tr> 
<td> 
<label>Password: <input type="text" name="password"/></label> 
<td> 
<label style="color:red">{password_message}</label> 
</td> 
</td></tr> 

<tr> 
<td> 
<label>Verify Password: <input type="text" name="verify_password"/> 
</label> 

<td> 
<label style="color:red">{password_match_message}</label> 
</td> 
</td></tr> 

<tr> 
<td> 
<label>Email (optional): <input type="text" name="email"/></label> 
<td> 
<label style="color:red">{email_message}</label> 
</td> 
</td></tr> 

</table> 
<input type = 'submit'/> 
</form> 
""" 

あなたは、私は別のエラーメッセージの変数名を作成し、そしてテーブルのメソッド=「ポスト」の外でフォームを作成したことがわかります。これをポストフォームにすると、後でMainHandlerクラスの中でpost関数を使うことができます。また

USER_RE = re.compile(r"^[a-zA-Z0-9_-]{3,20}$") 
def valid_username(username): 
    return username and USER_RE.match(username) 

PASS_RE = re.compile(r"^.{3,20}$") 
def valid_password(password): 
    return password and PASS_RE.match(password) 

def equal_password(verify_password, password): 
    if password == verify_password: 
     return True 
    else: 
     return False 

EMAIL_RE = re.compile(r'^[\S][email protected][\S\+\.[\S]+$') 
def valid_email(email): 
    return not email or EMAIL_RE.match(email)  

をMainHandlerクラスに:それは、ユーザーが入力した情報を取得し、(これらの機能は、リンクされたビデオでは、教師によって作成された)valid_usernamevalid_password、およびvalid_email機能に対してそれを比較します方法ですヘルパー関数を作成します。ヘルパー関数には、最初に変数を空の文字列に設定するパラメータがあります。

class MainHandler(webapp2.RequestHandler): 
def helper(self, user_message="", user_password="", match_password="", 
user_email=""): 
#string substitution 
    self.response.write(form.format(username_message= user_message, 
           password_message= user_password, 
           password_match_message= match_password, 
           email_message= user_email 
          )) 

(つまり、 '.format' のやっていることだ)文字列置換の詳細については、以下のリンクを参照してください。

https://pyformat.info/

https://docs.python.org/2/library/string.html

次の情報を取得するためにgetメソッドを使用しますフォームに入力します。作成したヘルパー関数を使用して、変数に入力された情報を取得します。

def get(self): 
    self.helper() 

ここで、postメソッドでは、ユーザーが入力した内容を調べます。

def post(self): 
    # look inside the request to figure out what the user typed 
    username = self.request.get("username") 
    password = self.request.get("password") 
    verify_password = self.request.get("verify_password") 
    email = self.request.get("email") 

    params = dict(username = username, 
        email = email) 

if文を作成して、要件が満たされているかどうかをテストします。まず、ユーザーがすべての要件を満たしているシナリオを作成する必要があります。その場合は、ウェルカムページにリダイレクトする必要があります。ユーザーが正しい情報を入力した場合

if not valid_username(username): 
     user_message="Username not valid" 
    if not valid_password(password): 
     user_password="Password not valid" 
    if not equal_password(password, verify_password): 
     match_password="Passwords must match" 
    if email is not "" and not valid_email(email): 
     user_email="Please enter a valid email"   

    self.response.write(form.format(username_message= user_message, 
           password_message= user_password, 
           password_match_message= match_password, 
           email_message= user_email 
          )) 

、あなたは歓迎にリダイレクトしたいと思う:ユーザーが要件を満たしていないときのための書類があれば

#if valid_username(username) == "" or ! valid_username 
    user_message="" 
    user_password="" 
    match_password="" 
    user_email="" 
    if valid_username(username) and valid_password(password) and equal_password(password, verify_password) and valid_email(email): 
     self.redirect('/welcome?username=' + username) 

次に、あなたが設定しますページ。ユーザーがユーザー名として入力した内容を取得することによって、何を書き込むかを定義する新しいクラスWelcomeを作成します。

class Welcome(webapp2.RequestHandler): 
    def get(self): 
     username = self.request.get('username') 
     if valid_username(username): 
      self.response.write(welcome.format(username = username)) 

#html for welcome page    
welcome = """ 
<!DOCTYPE html> 

<html> 
<head> 
    <title> 
    User Signup 
    </title> 
</head> 

<body> 
#string substitution for username 
<h2>Welcome, {username}!</h2> 
</body> 
</html> 
""" 

最後に、あなたのホームページやウェルカムページのパラメータを作成します。

app = webapp2.WSGIApplication([ 
('/', MainHandler), 
('/welcome', Welcome) 
], debug=True)