c# - 如何使 flutter 应用程序的 http 获取请求到本地主机？

Question

基本上，我是从一个 flutter 应用程序向我的本地主机发出一个 GET 请求，我在 visual studio 中有我自己的 Web API，每当我发出请求时，它都会给我 Bas Request[400]。所以当我发出这个请求时，它给出了我的错误请求，如果我使用我的 IP 地址发出请求也是如此，因为我正在使用实际的 android 手机来运行 flutter 而我不能使用'localhost'请求所以我写了我机器的 IP 地址。甚至在 postman 中也是如此。

我的 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 的隧道为了通过互联网公开您的本地主机 API，这将允许您从手机或模拟器上运行的应用程序访问它。使用隧道的优点之一是它相对容易启动和运行，但缺点之一是您的本地主机 API 会暴露在互联网上。