Python wtforms验证不需要'；使用AJAX时无法工作

我的页面上有两个表格-登录表格和注册表格。现在我想使用AJAX来验证这些表单，这样我就可以在不刷新页面的情况下看到输入错误。我曾尝试将所有AJAX内容添加到我已有的表单中，但现在似乎表单验证不起作用

routes.py

@users.route('/login', methods=['GET', 'POST'])
def login():
    loginForm = LoginForm()
    registerForm = RegisterForm()

    if request.method == 'POST':
        if registerForm.validate():
            return'wow it works'
        return 'something is wrong'

    return render_template("login.html", loginForm=loginForm, registerForm=registerForm)

另外，我想知道在发送邮寄请求时如何检查哪张表格有效？现在我只是想弄清楚如何解决这个问题，所以我只使用注册表。但当我同时拥有这两种形式时，如何验证一种形式而忽略另一种形式呢

login.html

const signUpButton=document.getElementById（“signUp”）；
const signInButton=document.getElementById（“signIn”）；
const container=document.getElementById（“容器”）；
signUpButton.addEventListener（'单击'，（）=>{
container.classList.add（“右面板活动”）；
});
signInButton.addEventListener（'单击'，（）=>{
container.classList.remove（“右面板激活”）；
});
常量字段={
用户名：{
输入：document.getElementById（'username'），
错误：document.getElementById（'username-error'）
},
电邮：{
输入：document.getElementById（'email'），
错误：document.getElementById（'email-error'）
},
密码：{
输入：document.getElementById（'password'），
错误：document.getElementById（'密码错误'）
},
确认密码：{
输入：document.getElementById（'confirm_password'），
错误：document.getElementById（'confirm-password-error'）
}
} 
var regForm=document.getElementById（'register-form'）；
regForm.addEventListener（'submit'，async（e）=>{
e、 预防默认值（）；
const response=wait fetch（“/login”{
方法：“POST”，
标题：{
“内容类型”：“应用程序/json”
},
正文：JSON.stringify({
用户名：fields.username.input.value，
电子邮件：fields.email.input.value，
密码：fields.password.input.value，
确认密码：fields.confirm\u password.input.value
})
});
if（response.ok）{
警惕（“是”）；
控制台日志（响应）；
}
否则{
const errors=wait response.json（）；
Object.key（错误）.forEach（（key）=>{
字段[key].input.classList.add（'input-invalid'）；
字段[key].error.innerHTML=errors[key][0]；
});
}
});

{{registerForm.hidden_tag（）}}
创建帐户
{%if registerForm.username.errors%}{{registerForm.username（class=“uk input input invalid”）}
{registerForm.username.errors%中的错误为%0}
{{error}}{%endfor%}
{%else%}{{registerForm.username（class=“uk input”）}{%endif%}
{%if registerForm.email.errors%}{{registerForm.email（class=“uk input input invalid”）}
{registerForm.email.errors%中的错误为%0}
{{error}}{%endfor%}
{%else%}{{registerForm.email（class=“uk input”）}{%endif%}
{%if registerForm.password.errors%}{{registerForm.password（class=“uk input input invalid”）}
{registerForm.password.errors%中的错误为%0}
{{error}}{%endfor%}
{%else%}{{registerForm.password（class=“uk input”）}{{%endif%}
{%if registerForm.confirm_password.errors%}{{registerForm.confirm_password（class=“uk input input invalid”）}
{registerForm.confirm_password.errors%}
{{error}}{%endfor%}
{%else%}{{registerForm.confirm_password（class=“uk input”）}{%endif%}
创建帐户
登录
{{loginForm.usernameLogin（class=“uk input”）}
{{loginForm.passwordLogin（class=“uk input”）}
{{loginForm.submit（class=“form button”）}
你还没有账户吗？
创建帐户
已经有账户了吗？
登录
使用WTForms验证JSON请求与处理普通的URL编码表单请求略有不同

下面是使用问题中的
注册表执行
的简单示例

# imports here
...
import wtforms_json

# Initialise wtforms_json
wtforms_json.init()

app = Flask(__name__) 
app.config['SECRET_KEY'] = b'secret'  


@app.route('/login', methods=['POST'])  
def login():

    # Get the JSON data from the request.
    formdata = request.get_json()
    # Create the form using the from_json constructor
    registerForm = RegisterForm.from_json(formdata=formdata)
    # Return a dict, which will automatically be serialised as JSON.
    if registerForm.validate_on_submit():
        return {'result': 'success'}
    return registerForm.errors 

app.run()

显著特点：


使用该包在wtforms中启用JSON处理。

必须调用
wtforms\u json.init（）
才能将json功能添加到
Form
类中

路由处理程序在表单验证后返回dicts；Flask将自动将这些转换为JSON响应。我发现最好在呈现整个HTML页面的GET路由处理程序中呈现表单，但在只传输JSON序列化数据时，使用单独的处理程序来处理来自javascript的请求

如果将此数据发送到应用程序，则会按照预期进行错误验证：

$cat register.json
{
“用户名”：“Tharg”，
“电子邮件”：“香蕉”，
“密码”：“红色”，
“确认密码”：“蓝色”，
“csrf_令牌”：“机密”
}
$curl-X POST-H“内容类型：application/json”-d@register.jsonhttp://localhost:5000/login 
{“确认密码”：[“字段必须等于密码]，“csrf密码”：[“csrf密码丢失]，“电子邮件”：[“可能不是电子邮件]，“密码”：[“密码太简单”]}