Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
256 views
in Technique[技术] by (71.8m points)

dart - How to call same API to do two different operations in flutter?

As I have said, in my flutter project I have to call a function i.e. verifyOtp() which will verify the otp and after successful otp verification it will register the user. Similarly I have to call again that same function to login the user. I know I have described a huge, but need help! Please help me!

The flow is:

  1. register the user and generate otp by calling generateOtp() and redirect to otp page.
  2. enter received otp and call verifyOtp() and redirect to home page.

/on home page by clicking on logout, redirect to login page where user will enter only the mobile no and onsubmit it will again call the same generate otp() as well as with same verifyOtp(). on success again redirect to home page./

This is the login part.

  1. Fetch the mobile number and pass it to generate_otp service, then pass the mobile no to the OTP page.
  2. Enter the received OTP and pass the mobile no and entered OTP to verify the otp service.
  3. On success call the login API by creating another function inside the service which I have created inside api_service.dart 4.On success redirect the user to home.

How do I do that? Please any help! Below is my code.

register.dart

class _RegisterPageState extends State<RegisterPage> {
  ApiService service = ApiService();
  final GlobalKey<FormState> _formKey = new GlobalKey<FormState>();
  var _key = new GlobalKey<ScaffoldState>();
  UserData _data = UserData();
  final setPadding = EdgeInsets.all(10.0);
  submit() async {
    if (this._formKey.currentState.validate()) {
      _formKey.currentState.save();

      Map<String, dynamic> map = {
        'first_name': _data.firstName,
        'last_name': _data.lastName,
        'mobile_no': _data.mobileNo,
        'email': _data.email,
        'source': 'app',
      };

      String userObj = json.encode(map);
      SharedPreferences preferences = await SharedPreferences.getInstance();
      preferences.setString('user_data', userObj);
      // calling generateOtp()
      service.generateOtp(_data.mobileNo, _key);
      Navigator.pushNamed(context, '/otp', arguments: '${_data.mobileNo}');
    } else {
      print('invalid credentials');
    }
  }

api_service.dart

class ApiService{
Future<bool> verifyOtp(String mobileNo, String otp, key) async {
    Dio dio = new Dio(options);
    FormData formData = FormData.fromMap({'mobile_no': mobileNo, 'otp': otp});
    try {
      Response response = await dio.post("verify_otp/", data: formData);
      if (response.statusCode == 200) {
        // Otp verified
        isVerified = true;
        showInSnackBar(response.data["msg"], key);
      }
    } on DioError catch (e) {
      showInSnackBar(e.message, key);
    }
    return isVerified;
  }

loginUser(String mobileNo)async {
    Dio dio = new Dio(options);
    FormData formData = FormData.fromMap({
      'mobile_no': mobileNo

    });
    Response response = await dio.post("login/", data: formData);
    print(response.data);
  }
}

otp.dart

class OtpPage extends StatefulWidget {
  final String mobNumber;
  String formattedMobNo;
  
  OtpPage(this.mobNumber) {
    formattedMobNo = this.mobNumber.replaceRange(2, 8, 'XXXXXX');
  }

  @override
  _OtpPageState createState() => _OtpPageState();
}

class _OtpPageState extends State<OtpPage> {
  ApiService service = ApiService();

  final GlobalKey<FormState> _formKey = new GlobalKey<FormState>();
  var _key = new GlobalKey<ScaffoldState>();
  }   
  TextEditingController pinController = TextEditingController();
  submit() async {
    _formKey.currentState.save();
    print(pinController.text);
    print(widget.mobNumber);
    bool verify =
        await service.verifyOtp(widget.mobNumber, pinController.text, _key);
    print(verify);
    if (verify) {
      SharedPreferences preferences = await SharedPreferences.getInstance();
      String userInfo = preferences.getString('user_data');
     // Decoding String data to map
      Map map = json.decode(userInfo);
      print(map);
      service.registerUser(map);
      preferences.setBool('isLogin', true);
      Navigator.of(context).pushNamed('/home');
    } else {
      showInSnackBar('Invalid otp', _key);
    }
  }

login.dart

class LoginPage extends StatefulWidget {
  @override
  _LoginPageState createState() => _LoginPageState();
}    
class _LoginPageState extends State<LoginPage> {
  ApiService service = ApiService();
  var _key = new GlobalKey<ScaffoldState>();
  final GlobalKey<FormState> _formKey = new GlobalKey<FormState>();
  UserData _data = UserData();
  loginUser()async {
    if (this._formKey.currentState.validate()) {
      _formKey.currentState.save();
      print(_data.mobileNo);
      service.generateOtp(_data.mobileNo, _key);
      Navigator.pushNamed(context, '/otp', arguments: '${_data.mobileNo}');
    }
  }

route.dart

class RouteGenerator {
  static Route<dynamic> generateRoute(RouteSettings settings) {
    switch (settings.name) {
      case '/':
        return MaterialPageRoute(builder: (_) => SplashScreenPage());
      case '/register':
        return MaterialPageRoute(builder: (_) => RegisterPage());
      case '/login':
        return MaterialPageRoute(builder: (_) => LoginPage());
      case '/otp':
        var mobNumber = settings.arguments as String;
        return MaterialPageRoute(builder: (_) => OtpPage(mobNumber));
      case '/home':
        return MaterialPageRoute(builder: (_) => HomePage());
      default:
        return MaterialPageRoute(
            builder: (_) => Scaffold(
                  body: Center(
                      child: Text('No route defined for ${settings.name}')),
                ));
    }
  }
}
question from:https://stackoverflow.com/questions/65831722/how-to-call-same-api-to-do-two-different-operations-in-flutter

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)
Waitting for answers

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...