我应该在我的 Flutter 应用程序中为 "localhost" 使用什么地址？

Question

我在我的 Flutter 应用程序中使用了以下代码并且它没有任何问题，但是今天在我升级了我的 Flutter 之后，它不起作用并给我 XMLHttpRequest error.

  Future<void> _authenticate(
      String email, String password, String urlSegment) async {
    final host = UniversalPlatform.isAndroid ? '10.0.2.2' : '127.0.0.1';
    final url = Uri.parse('http://$host:8000/api/$urlSegment');

    try {
      final http.Response response = await http.post(
        url,
        headers: {"Content-Type": "application/json"},
        body: json.encode(
          {
            'email': email,
            'password': password,
          },
        ),
      );

Flutter 新版本有什么变化吗？我是否应该更改以下指定我的 host 地址的代码行？

    final host = UniversalPlatform.isAndroid ? '10.0.2.2' : '127.0.0.1';

编辑：我尝试将 cors 添加到我的 NodeJS 后端服务器，这是我的 app.ts 文件，如下所示：

import express, { Request, Response, NextFunction } from "express";
import cors from "cors";
import dotenv from "dotenv";
dotenv.config();
import config from "config";
import responseTime from "response-time";
import connect from "./utils/connect";
import logger from "./utils/logger";
import routes from "./routes";
import deserializeUser from "./middleware/deserializeUser";
import { restResponseTimeHistogram, startMetricsServer } from "./utils/metrics";
import swaggerDocs from "./utils/swagger";

const allowedOrigins = ['http://localhost:8000' , 'https://10.0.2.2:8000', 'http://127.0.0.1:8000'];

const options: cors.CorsOptions = {
  origin: allowedOrigins
};

const port = config.get<number>("port");

const app = express();

app.use(express.json());


app.use(cors(options));

app.use(deserializeUser);

app.use(
  responseTime((req: Request, res: Response, time: number) => {
    if (req?.route?.path) {
      restResponseTimeHistogram.observe(
        {
          method: req.method,
          route: req.route.path,
          status_code: res.statusCode,
        },
        time * 1000
      );
    }
  })
);

app.listen(port, async () => {
  logger.info(`App is running at http://localhost:${port}`);

  await connect();

  routes(app);

  startMetricsServer();

  swaggerDocs(app, port);
});

但还是不行，我得到了同样的错误！

Answer 1

您已将允许的来源设置为 :8000，但那是后端服务器的地址。相反，您需要将其设置为 Flutter 调试服务器的地址（如果与后端服务器不完全相同，则最终设置为您托管生产应用程序的 Web 服务器）。（您可以删除所有以 8000 结尾的地址。）

问题是调试服务器为每个运行选择一个随机端口。您可以告诉它使用固定端口，然后该端口将成为您需要包含在允许的来源中的端口。

将 --web-hostname=localhost --web-port=9999 作为命令行参数添加到运行和 main.dart 的位置，然后添加 localhost:9999 作为允许的来源。

（作为 get-out-of-jail，也尝试将 * 作为允许的来源。）

最后，您可能应该明确地将 CORS 允许的方法设置为服务器 API 期望的方法列表；可能是 OPTIONS、GET 和 POST.

我应该在我的 Flutter 应用程序中为 "localhost" 使用什么地址？

What address should I use for "localhost" in my Flutter app?

node.js

flutter

cors

xmlhttprequest

host