dart 从真实的的移动的浏览器访问flutter localhost

liwlm1x9  于 2023-02-17  发布在  Flutter
关注(0)|答案(6)|浏览(157)

我有flutter网络应用程序,可以很容易地部署到我的电脑上的chrome浏览器。成功部署后:
1.控制台

1.网页浏览器(Chrome)

我正在寻找从我的iPhone浏览器访问运行在chrome的localhost的方法。我的iPhone和PC都连接到同一个网络。我抓住网络的IP地址,并尝试从我的iPhone Safari浏览器访问链接为:
http://192.168.43.36:61867
但它不工作,我得到'该网站无法到达'的消息。有没有任何额外的步骤,我可以执行,使flutter localhost从我的移动的浏览器访问或只是它不可能与flutter?

soat7uwm

soat7uwm1#

如果只想调试,可以使用

flutter run -d web-server --web-port 8080 --web-hostname 0.0.0.0

然后访问http://:8080

**您还应确保端口(8080)处于打开状态。

vfh0ocws

vfh0ocws2#

在开发应用的过程中,Flutter实际上并不输出JS。flutter run命令在Chrome浏览器中使用development compiler启动应用,这意味着Dart代码直接在Chrome中运行。而且你无法从网络中的另一台机器访问Chrome,因为它不充当服务器。
您可能应该在JS中编译应用程序(AKA flutter build web)来进行常规部署,以便从其他主机访问它。您可以使用Python的简单HTTP服务器来为应用提供服务。无需安装任何框架,配置任何内容,并编写Python代码。只要确保您安装了Python 3,并从您的应用程序构建输出运行python -m http.server 8000。它将在端口8000上为应用程序提供服务。

xggvc2p6

xggvc2p63#

我设法让它在Mac上工作并在iPhone上测试的唯一方法是:
在终端的项目文件夹中:

flutter build web

无声音零安全的建筑物有关详细信息,请参阅https://dart.dev/null-safety/unsound-null-safety
正在编译用于Web的lib/main.dart... 34.5秒

cd build/web
python3 -m http.server 8000

HTTP服务于::端口8000(http://[::]:8000/)...::1 - - [2021年3月28日18:34:31]“获取/ HTTP/1.1”200 -::1 - - [2021年3月28日18:34:31]“获取/主要. dart. js HTTP/1.1”200 -::1 - - [2021年3月28日18:34:31]“获取/清单...
然后在新端子选项卡中:

~/ngrok http 8000

转发https://xxxxxx.ngrok.io
或如何使用ngrok的信息:www.ngrok.com

yc0p9oo0

yc0p9oo04#

备选
1.构建应用程序:flutter build web
1.更改目录:cd <pathProject>/web/build
1.启动任何服务器:python -m http.server 5000
1.上限:ngrok http.server 5000
1.在移动的浏览器中:“https://a824ccb9d545.ngrok.io“(示例)

ee7vknir

ee7vknir5#

使用这个免费的服务ngrok.com,你可以公开你的本地主机,这样你不仅可以在同一个网络上访问你的应用程序,还可以通过互联网与其他人分享,比如你的移动的。

qyzbxkaa

qyzbxkaa6#

要在连接到同一网络的其他计算机上访问
1.复制你的网络ip地址和写特定端口旁边的ip
1.在项目最终运行中
flutter run-d网络服务器-网络端口(端口)-网络主机名(您的IP地址)
示例:

flutter run -d web-server --web-port 8080 --web-hostname 192.168.100.17

然后点击链接http://192.168.100.17:8080,它将打开应用程序

相关问题