Dart HttpServer HttpResponse 重定向 [英] Dart HttpServer HttpResponse redirect

问题描述

我正在使用 dart:io 的 HttpServer 来实现 Web 服务器，并且我尝试在使用 JavaScript 发送 DELETE 请求后重定向到页面.下面是我正在尝试做的一个最小的例子，但我无法让它正常工作.目前，当我访问 localhost:8000 时，下面的成功返回了主页，它也成功地返回了 GET/thing 处的表单按钮.当我单击删除按钮时，请求成功发送到 DELETE/thing 并返回 302 状态代码.然后按预期向/deleted 发出请求，但方法是 DELETE，并且字符串deleted thing, delete method"不存在.返回但未呈现.首先，我想知道如何确保重定向使用的是 GET 而不是 DELETE(即它应该是 GET/deleted)，然后我想知道如何确保被删除"呈现(假设解决前者也不能解决这个问题).我不确定问题出在 Dart 代码还是 Javascript 中.Dart .redirect() 方法不提供更改方法的方法，据我所知，Javascript 的 fetch() 也没有，所以我有不知道如何确保重定向使用 GET 而不是 DELETE.

I am using dart:io's HttpServer to implement a web server and I am trying to redirect to a page after using JavaScript to send a DELETE request. Below is a minimal example of what I am trying to do but I cannot get it to work correctly. Currently the below sucessfully returns the home page when I visit localhost:8000, it also successfully returns the form button at GET /thing. When I click the delete button, a request is successfully sent to DELETE /thing and a 302 status code is returned. Then a request is made to /deleted as expected but the method is DELETE, and the string "deleted thing, delete method" is returned but not rendered. Firstly I would like to know how to make sure the redirect is using GET not DELETE (i.e. it should be GET /deleted), then I would like to know how to make sure "get deleted" is rendered (assuming solving the former doesn't also fix this). I am not sure whether the problem is in the Dart code or Javascript. The Dart .redirect() method doesn't provide a way to change the method, and as far as I can tell Javascript's fetch() doesn't either so I have no idea how to make sure the redirect uses GET not DELETE.

import 'dart:io';

Future<void> main() async {
  HttpServer server = await HttpServer.bind(InternetAddress.loopbackIPv4, 8000);

  // assert(app.server != null);
  await for (HttpRequest request in server) {
    String path = request.uri.path;
    String method = request.method;

    if (path == "/" && method == "GET") {
      print("get home");
      request.response.write('home page');
      await request.response.close();
    }
    if (path == "/" && method == 'DELETE') {
      print("delete home");
      request.response.write('home page, with delete method');
      await request.response.close();
    }
    if (path == "/thing" && method == "GET") {
      print("get thing");
      request.response.headers.contentType = ContentType.html;
      request.response.write(
          """<form action="/thing"><input type="submit" value="delete"></form>
            <script>
              const form = document.querySelector("form");
              form.addEventListener("submit", event => {
                event.preventDefault();
                fetch("/thing", { method: "DELETE", redirect: 'follow'}).then(response => 
                alert("deleted thing"));
              });
            </script>""");
    }
    if (path == "/thing" && method == "DELETE") {
      print("delete thing");
      await request.response.redirect(Uri(
          scheme: request.requestedUri.scheme,
          host: request.requestedUri.host,
          port: request.requestedUri.port,
          path: "/deleted"));
    }
    if (path == "/deleted" && method == "GET") {
      print("get deleted");
      request.response.write('deleted thing');
      await request.response.close();
    }
    await request.response.close();
  }
}

推荐答案

使用 303 而不是 302 将确保重定向是 GET 请求而不是 DELETE 请求，但事实证明无法从由于 https://github.com/whatwg/fetch/issues/763.

Using 303 instead of 302 will ensure the redirect is a GET request instead of a DELETE request, however it turns out it is not possible to make a HTTP request from javascript that redirects because of https://github.com/whatwg/fetch/issues/763.

这篇关于Dart HttpServer HttpResponse 重定向的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！