Connectivity between Flutter and Rasa using Rest API

Rasa Open Source
1

I want to know how to Implement connectivity between Flutter and RASA using Rest API Json query

1 Like
2

hi @Dilshan !

What you probably want is one of the rest channels

2 Likes
3

Like @amn41 said you probably want to use the REST API function of the Rasa server. I supposed you could utilize the socketio function, but I think using REST from Flutter would be easier to setup.

Basically your app would send the user’s input to that rest endpoint and wait for the rasa sever to respond. you would need to parse the json response and pull the response text and display it in your app.

If you want to see how some of that parsing is done, there’s a really good Web chat ui I’ve played around with and uses HTML / CSS / jQuery. You may not be a fan of jQuery, but it is pretty easy to see how to deal with different response formats from straight text, to panels of data.

It is pretty much plug-n-play locally so you spin up your rasa server and action server (and anything else you need like Duckling, etc) open index.html in a browser and you’re good to go.

That repo is here:

2 Likes
4

please show a connectivity example between flutter and rasa

5

hey @Meet, you can call the Rasa’s REST api within flutter and render the response accordingly.

You can use REST channel for interacting with the bot from flutter

I am attaching the sample code for calling REST api in flutter.

Future<http.Response> getBotResponse(String senderId, String message) {
  return http.post(
    'http://your-bot-ip:5005/webhooks/rest/webhook',
    headers: <String, String>{
      'Content-Type': 'application/json; charset=UTF-8',
    },
    body: jsonEncode(<String, String>{
      'sender': senderId,
      'message': message
    }),
  );
}

You can can get the complete example of the calling POST HTTP request in flutter here.

Thanks, Jitesh

4 Likes
7

have you done it? I am also stuck with connecting rasa with my app can you provide detailed step by step explanation

8

Connecting Flutter and Rasa using REST API:

  1. Setup:

    • Ensure your Rasa server is running and accessible.
    • In your Flutter project, add the http package to pubspec.yaml:
      dependencies:
  http: ^0.13.5
```

  2. Making API calls:

    • Use the following endpoint for Rasa’s REST API:
      final url = Uri.parse('http://your_rasa_server:5005/webhooks/rest/webhook');

  3. Sending messages:

    • Create a function to send POST requests:
      import 'package:http/http.dart' as http;
import 'dart:convert';

Future<void> sendMessage(String message) async {
  final response = await http.post(
    url,
    headers: {'Content-Type': 'application/json'},
    body: jsonEncode({
      'sender': 'user',
      'message': message,
    }),
  );

  if (response.statusCode == 200) {
    final List<dynamic> botResponses = jsonDecode(response.body);
    // Process bot responses here
  } else {
    print('Error: ${response.reasonPhrase}');
  }
}

  4. Handling responses:

    • Parse the JSON response and update your UI accordingly.
    • Remember to handle different types of Rasa responses (text, images, buttons).

  5. Error handling:

    • Implement proper error handling for network issues or unexpected responses.

  6. State management:

    • Use a state management solution (e.g., GetX, Provider) to update your UI based on API responses.

Key differences from WebSocket approach:

  • REST API uses request-response model, not real-time.
  • Each message requires a new HTTP connection.
  • Suitable for simpler interactions or when WebSockets aren’t available.

For more detailed implementation, including WebSocket integration and advanced features, refer to the full article: Seamless Integration: Connecting Rasa NLU Chatbot with Flutter using WebSockets