Actions

[pastelcode]

How can I handle, let's say, a POST request from a form submission?

[cookesan]

For a plain HTML form, render the form with method: FormMethod.post and handle the POST on the server side.

In server mode, the usual pattern is to mount your Jaspr app behind a shelf_router and add your own POST route before the app route. The jaspr_pad app in this repo does this for its /api endpoints.

Minimal shape:

import 'dart:io';

import 'package:jaspr/server.dart';
import 'package:shelf/shelf.dart';
import 'package:shelf/shelf_io.dart';
import 'package:shelf_router/shelf_router.dart';

import 'main.server.options.dart';

void main() async {
  Jaspr.initializeApp(options: defaultServerOptions);

  final router = Router();

  router.post('/contact', (Request request) async {
    final body = await request.readAsString();
    final fields = Uri.splitQueryString(body);

    final name = fields['name'];
    final message = fields['message'];

    // Do your server-side work here.

    return Response(303, headers: {'location': '/'});
  });

  router.mount('/', serveApp((request, render) {
    return render(Document(title: 'App', body: App()));
  }));

  final port = int.parse(Platform.environment['PORT'] ?? '8080');
  await serve(router.call, InternetAddress.anyIPv4, port);
}

And the component can render a normal form:

form(
  action: '/contact',
  method: FormMethod.post,
  [
    input(attributes: {'name': 'name'}),
    textarea(attributes: {'name': 'message'}, []),
    button(type: ButtonType.submit, [text('Send')]),
  ],
)

If you are building a static-only site, there is no running Dart server to receive that POST, so you would need an external endpoint or switch to server mode.

[pastelcode]

Thank you for your replay. I tried it and it worked as expected!