如何从flutter应用程序向本地主机发出http get请求？

Question

基本上我是从一个颤振应用程序向我的本地主机发出请求，我在 Visual Studio 中有自己的 Web API，每当我发出请求时，它都会给我 Bas Request[400]。所以当我提出这个请求时，它给出了我的错误请求，如果我使用我的 IP 地址发出请求也是这种情况，因为我使用的是实际的 android 手机来运行颤振，我无法使用“localhost”请求所以我写了我机器的IP地址。甚至在邮递员中也是如此。

我的 Fluuter 应用：

import 'dart:io';
import 'package:dio/adapter.dart';
import 'package:flutter/material.dart';
import 'package:dio/dio.dart';


class Project {
  final String Id;
  final String Name;
  final double Amount;


  Project({this.Id, this.Name, this.Amount});

  factory Project.fromJson(Map<String, dynamic> json) {
    return Project(
      Id: json['Id'],
      Name: json['Name'],
      Amount: json['Amount'],
    );
  }
}


void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  MyApp({Key key}) : super(key: key);

  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

  List<Project> projects = new List<Project>();
  String url = "https://192.168.100.5:44391";

  void fetsh() async
  {
    Dio dio = new Dio();
    (dio.httpClientAdapter as DefaultHttpClientAdapter).onHttpClientCreate =
        (HttpClient client) {
      client.badCertificateCallback =
          (X509Certificate cert, String host, int port) => true;
      return client;
    };
    try
    {
      var respond = await dio.get("$url/api/Project");
      print(respond.statusCode);
      print(respond.data);
      var respondData = respond.data as List;
      setState(() {
        projects = respondData.map((e) => Project.fromJson(e)).toList();
      });

    }
    catch(e) {
      print("error");
      print(e);
    }

  }



  @override
  void initState() {
    super.initState();
    fetsh();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Fetch Data Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('Fetch Data Example'),
        ),
        body: ListView.builder(
            itemCount: this.projects.length,
            itemBuilder: (BuildContext context, int index) {
              return new Text(this.projects[index].Name);
            }
        )
      ),
    );
  }
}

和服务器端：

using demo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;

namespace demo.Controllers
{
    public class ProjectController : ApiController
    {
        List<Project> mylist = new List<Project>();
        public ProjectController()
        {
            mylist.Add(new Project { Id = 1, Name = "Project 1", Amount = 150 });
            mylist.Add(new Project { Id = 2, Name = "Project 2", Amount = 150 });
            mylist.Add(new Project { Id = 3, Name = "Project 3", Amount = 150 });

        }
        // GET: api/Project
        public List<Project> Get()
        {
            return mylist;
        }

        [Route("api/Project/GetProjectNames")]
        [HttpGet]
        public List<string> GetProjectNames() 
        {
            List<string> output = new List<string>();
            foreach (var item in mylist)
            {
                output.Add(item.Name);
            }
            return output;
        }

        // GET: api/Project/5
        public Project Get(int id)
        {
            return mylist.Where(x=>x.Id == id).FirstOrDefault();
        }

        // POST: api/Project
        public void Post([FromBody]string value)
        {
        }

        // PUT: api/Project/5
        public void Put(int id, [FromBody]string value)
        {
        }

        // DELETE: api/Project/5
        public void Delete(int id)
        {
        }
    }
}

Answer 1

您可以使用ngrok 之类的隧道在互联网上公开您的 localhost API，这将允许您从手机或模拟器上运行的应用程序访问它。使用隧道的优点之一是启动和运行相对容易，但缺点之一是您的 localhost API 会暴露在 Internet 上。

Answer 2

不清楚您是尝试在本地网络中访问后端进行测试还是通过 Internet。对于本地网络，只需使用运行后端的机器的 IP。对于互联网，您需要使用您的互联网 IP 或使用诸如 duckdns.org 之类的东西来为您提供一个可以与动态 IP 一起使用的域。对于互联网访问，不要忘记将您路由器上的后端端口转发到运行后端代码的 IP。