Authentication 通过颤振中的RESTAPI登录验证用户

我用RESTAPI登录。我的应用程序工作起来就像用户名和密码正确，然后转到应用程序的主页。如果为false，则在页面上引发异常。问题在于凭证为true或false时。它在下一个上下文或屏幕上显示循环进度指示器。如果凭证为true。它像 然后是MainApp

如果credential为false，则会在MainAppScreen的else中显示异常页面。 但是如果用户credential是错误的，我想在下面这样的表单中显示错误。 我正在进行为期两天的验证，以确保没有获得所需的输出。我的代码文件main.dart

import 'package:flutter/material.dart';
import 'package:testing/api.dart';
import 'package:testing/sucess.dart';

main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: SignIn(),
    );
  }
}

class SignIn extends StatefulWidget {
  @override
  _SignInState createState() => _SignInState();
}

class _SignInState extends State<SignIn> {
  TextStyle style = TextStyle(fontFamily: 'Montserrat', fontSize: 20.0);
  //Gettting the JwtToken object and making the instance of it

  Future<LoginResponse> _futureJwt;
  final TextEditingController _controller = TextEditingController();
  //Getting the password from the textField
  final TextEditingController _controller1 = TextEditingController();


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // appBar: AppBar(

      // ),
      backgroundColor: Colors.white,
      body: Container(
        alignment: Alignment.center,
        // padding: const EdgeInsets.all(8.0),
        //if Field have the null values then Get the value from the textField

        child: (_futureJwt == null)
            ? SingleChildScrollView(
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    // SizedBox(
                    //   height: MediaQuery.of(context).size.height * 1 / 3,
                    //   child: Image.asset(
                    //     "assets/IMG_2382.png",
                    //     fit: BoxFit.cover,
                    //   ),
                    // ),
                    // SizedBox(height: 45.0),
                    Padding(
                      padding: const EdgeInsets.only(left: 30,right: 30),
                      child: TextField(
                        style: style,
                        decoration: InputDecoration(

                          contentPadding:
                              EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
                          hintText: "Email",
                          border: OutlineInputBorder(
                            borderRadius: BorderRadius.circular(20.0),
                          ),
                        ),
                        controller: _controller,
                      ),
                    ),
                    SizedBox(height: 25.0),
                    Padding(
                      padding: const EdgeInsets.only(left: 30,right: 30),
                      child: TextField(
                        controller: _controller1,
                        obscureText: true,
                        style: style,
                        decoration: InputDecoration(
                          contentPadding:
                              EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
                          hintText: "Password",
                          border: OutlineInputBorder(
                            borderRadius: BorderRadius.circular(20.0),
                          ),
                        ),
                      ),
                    ),
                    SizedBox(
                      height: 35.0,
                    ),
                    Material(
                      elevation: 5.0,
                      borderRadius: BorderRadius.circular(5.0),
                      color: Colors.white,
                      child: Container(
                        width: 150,
                        height: 50,
                        child: RaisedButton(                    
                          child: Text(
                            "Login",
                            textAlign: TextAlign.center,
                            style: style.copyWith(
                                color: Colors.white,
                                fontWeight: FontWeight.bold),

                          ),
                          color: Colors.grey[800],
                          // padding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
                          onPressed: () {
                            setState(() {
                              _futureJwt = createLoginState(
                                  _controller.text, _controller1.text);
                            });
                          },
                        ),
                      ),
                    ),
                    SizedBox(
                      height: 15.0,
                    ),
                  ],
                ),
              )
            //If the Conditiion (_futureJwt == null) is false then
            : FutureBuilder<LoginResponse>(
                //refer the object to the future
                future: _futureJwt,
                //
                builder: (context, snapshot) {
                  //if the data is getting
                  if (snapshot.hasData) {
                    var token = snapshot.data.token;
                    print(token);
                    return Sucess();
                  }
                  //if the data results an error
                  else if (snapshot.hasError) {
                    return Text("${snapshot.error}");
                  }

                  return CircularProgressIndicator();
                },
              ),
      ),
    );
  }
}

import 'package:flutter/material.dart';

class Sucess extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text('data'),
    );
  }
}

api.dart

import 'package:http/http.dart' as http;
import 'dart:convert';
import 'dart:async';

Future<LoginResponse> createLoginState(String username, String password) async {
  final http.Response response = await http.post(
      'http://192.168.43.76//soledesign/wp-json/jwt-auth/v1/token',
      headers: <String, String>{
        'Accept': 'application/json',
      },
      body: {
        'username': username,
        'password': password,
      });

  if (response.statusCode == 200) {
    print(response.body);
    return LoginResponse.fromJson(json.decode(response.body));
  } else {
    throw Exception('Failed to create album.');
  }
}

class LoginResponse {
  String token;
  String userEmail;
  String userNicename;
  String userDisplayName;

  LoginResponse(
      {this.token, this.userEmail, this.userNicename, this.userDisplayName});

  LoginResponse.fromJson(Map<String, dynamic> json) {
    token = json['token'];
    userEmail = json['user_email'];
    userNicename = json['user_nicename'];
    userDisplayName = json['user_display_name'];
  }
}

import'package:http/http.dart'作为http；
导入“dart:convert”；
导入“dart:async”；
未来createLoginState（字符串用户名、字符串密码）异步{
final http.Response Response=wait http.post(
'http://192.168.43.76//soledesign/wp-json/jwt-auth/v1/token',
标题：{
“接受”：“应用程序/json”，
},
正文：{
“用户名”：用户名，
“密码”：密码，
});
如果（response.statusCode==200）{
打印（响应.正文）；
返回LoginResponse.fromJson（json.decode（response.body））；
}否则{
抛出异常（'未能创建相册'）；
}
}
类登录响应{
字符串标记；
字符串userEmail；
字符串用户名；
字符串userDisplayName；
后勤响应(
{this.token、this.userEmail、this.userNicename、this.userDisplayName}）；
LoginResponse.fromJson（映射json）{
token=json['token']；
userEmail=json['user_email']；
userNicename=json['user_nicename']；
userDisplayName=json['user_display_name']；
}
}

您需要做的是添加一个警报框，当json响应出现错误消息时会显示该框。像这样：

if（json['ErrorMessage]！=null）{ShowAlertDialog（）；}