Ad

How To Make An MVC API Request From Flutter

- 1 answer

I am building a Flutter app with user authentication. It works fine with firebase. However, I would like to code it agains SQL Server database.

I am now trying to get a user token returned from an MVC application. This is the code in my Controller:

Public Function AuthenticateUsers(ByVal APIKey As String, ByVal Password As String, ByVal ReturnSecureToken As Boolean) As JsonResult

        Dim Users As Object

        If String.IsNullOrEmpty(APIKey) Or String.IsNullOrEmpty(Password) Then
            Users = "missing parameters"
        Else
            If APIKey = "mambo" AndAlso Password = "[email protected]" Then
                Users = GetUsers()
            Else
                Users = "Invalid credentials"
            End If
        End If

        Return Json(Users, JsonRequestBehavior.AllowGet)

    End Function

    Private Function GetUsers() As List(Of UserModel)

        Dim usersList = New List(Of UserModel) From {
            New UserModel With {
                .idToken = 200,
                .localId = "localId",
                .expiresIn = "3600"
            }
        }

        Return usersList

    End Function

Results from the controller

And this is the code section responsible for authentication in flutter app:

  Future<void> _authenticate(
      String email, String password, String urlSegment) async {
    // final url =
    //     'https://www.googleapis.com/identitytoolkit/v3/relyingparty/$urlSegment?key=LONGKEY';

    final url = 'https://localhost:12345/Member/AutheticateUsers';
    try {
      final response = await http.post(
        url,
        body: json.encode(
          {
            'APIKey': email.trim(),
            'Password': password.trim(),
            'ReturnSecureToken': true,
          },
        ),
      );
      final responseData = json.decode(response.body);
      if (responseData['error'] != null) {
        throw HttpException(responseData['error']['message']);
      }
      _token = responseData['idToken'];
      _userId = responseData['localId'];
      _expiryDate = DateTime.now().add(
        Duration(
          seconds: int.parse(
            responseData['expiresIn'],
          ),
        ),
      );
      _autoLogout();
      notifyListeners();
      final prefs = await SharedPreferences.getInstance();
      final userData = json.encode(
        {
          'token': _token,
          'userId': _userId,
          'expiryDate': _expiryDate.toIso8601String(),
        },
      );
      prefs.setString('userData', userData);
    } catch (error) {
      print(error);
      throw error;
    }
   }

I have commented out that line that would be successfully authenticating to firebase and rewrote a url to redirect to my MVC application.

So now the problem is I am getting the error that the request is refused. It is the first time I am trying to get external application call an API. So I think I could be missing some prerequisites/formats.

Could someone please guide me on how to make this work.

Thanks!

Ad

Answer

In this process, I discovered a number of things that (I think) should have been made obvious almost at introduction of flutter (depending on where you read from!). Well, let me be one of those who try to make it obvious :)

Flutter loves firebase. So, there is very little existing guidance for lovers of MS SQL Server. I really struggled with doing queries/views in firebase. So it was natural that all the time I was wondering how I could redo the app against my familiar grounds, SQL Server and mySQL.

So, the first not so obvious note is that:

  1. localhost in flutter for Android emulator is 10.0.2.2! Wow!
  2. localhost in flutter for iOS emulator is locahost, or 127.0.0.1, or localhost... I read earlier that IP addresses are preferred in app development.
  3. localhost for real device is a whole lot more complicated. I didn't even bother, at least for now.

Thanks https://medium.com/@podcoder/connecting-flutter-application-to-localhost-a1022df63130

I am not sure if that would be the first thing any .NET developer would be thinking about... for me it was the last thing I searched for after 3 days of failure!

My own failure in the code above, which would not be obvious in the code I posted, is that I created a Controller, not an APIController. This was my first effort as mentioned, and I had not noted the difference when I started this.

PS: Because I fell in love with Flutter in VS Code the moment I tried it, I now know it was not lack of effort, but rather the design of Java in Android that used to put me off!

Ad
source: stackoverflow.com
Ad