logo标签列表

如何从iPhone浏览器访问运行在本地主机上的网站

iphonelocalhost
378

我正在开发一个移动网站，并希望使用我的iPhone浏览器进行测试。我的Windows 7电脑和iPhone都连接在同一个无线网络上。如何从iPhone访问本地主机？目前我得到了一个404错误。

1
确保你已经关闭了防火墙。 - ajahongir
在同一网络上的另一台/移动设备上，请访问：“http://IP地址:端口”。详细信息请参见以下答案。 - Arshin
28个回答
317

从iPhone访问本地主机将只会进行回环尝试连接自身（如果支持的话）。

您需要做的是找到您台式机的IP地址（例如，在Windows系统中，打开命令提示符并键入ipconfig或进入网络和共享中心并查找连接状态）。

一旦获得了您的IP地址，只需从浏览器中访问它，例如：http://192.168.0.102

如果您正在使用防火墙，请在防火墙的入站安全设置中打开80端口（或您的网站运行的任何端口）。

注意：如果您想在iPhone的浏览器中调试应用程序，则不要忘记应用程序的端口，例如：http://192.168.0.102:3000。在本例中，3000是ReactJS使用的默认端口。

2
从iPhone访问本地主机只会执行回环/尝试连接到自身（如果支持的话？）- 当然它支持。几乎和我的答案一样，哈哈哈 ;) - cusspvz
2
如果测试是针对WordPress的，则必须在WordPress仪表板中更改网站URL为http://xxx.xxx.xxx.xxx/wordpress。 - Rajul
1
实际上，尝试访问您计算机上的一个开放端口localhost:port。在我的设置中，它可以正常工作。 - orip
3
据我所知，这种方法无法用于调试渐进式网络应用程序，因为这些应用程序通常使用服务工作者，而服务工作者需要 https，这就需要证书。在 Android 上，它会转发端口，以便您仍然可以使用本地主机，因此不需要费心获取证书。 - Max Waterman
1
在纸面上这听起来很简单明了，但不知为何对我并不起作用，尽管机器在同一网络中并且使用了正确的本地IP地址。（该应用正在Mac上运行，试图在iPhone上打开它）。 - Saro
显示剩余6条评论
258
如果您使用的是 Mac 操作系统，可以进入“系统偏好设置”>“网络”，使用您的 IP 地址代替本地主机。您还可以使用端口号。在我的情况下，我有一个运行在 1448 端口上的服务器，我可以使用 iPhone 预览 192.168.1.241:1448。请参考下图中的 Mac 网络设置界面。
9
这个回答在计算机科学方面和视觉设计方面达到了完美的平衡。做得好。 - Roralee
118
按住Alt/Option键，同时单击Wi-Fi菜单栏项。这将提供关于你的连接的许多额外信息，包括你的本地IP地址。 - William Robertson
如果您的服务器使用虚拟主机（多个主机名），则无法正常工作。 - James
2018年：网络实用工具 > 信息（第一个选项卡）> IP地址（在接口信息下方）- 它有效！谢谢。 - webkit
6
为了访问开发沙盒，我需要将沙盒主机从“localhost”更改为“0.0.0.0”。https://dev59.com/cVsW5IYBdhLWcg3wFj5p#35419631 - Ben
在我的情况下，直接在iPhone上输入地址无法工作（我尝试过仅使用IP，使用http://和https://，但都不起作用），因此我在我的电脑上使用Chrome键入了URL（带有https://），然后使用QR码共享了URL（但我想任何其他选项也可以）。 - Giorgio Tempesta
36
你可以尝试使用 ngrok.io，它与localtunnel的工作原理相同。
下载适用于你操作系统的应用，并尝试运行以下命令：

对于Linux：

./ngrok http 8000

8000是您的应用程序运行的端口号。

对于Windows操作系统：

 ngrok.exe http 8000
5
这个回答从理论上回答了这个问题，但最好在此处包含答案的关键部分以供未来用户参考，并提供链接作为参考。重度依赖链接的回答可能会因为链接失效而无法使用。 - Mogsdad
谢谢，我编辑了答案。但是它仍然以链接为主。不过，如果链接失效，我们总是可以通过谷歌搜索。 - Manish Gupta
并暴露漏洞问题 - Ng Atom
31

请尝试以下步骤：

  1. 按下 Windows + R
  2. 打开 cmd
  3. 运行命令 ipconfig (旧) 或 ifconfig (新)
  4. 查看您的无线网络卡IP地址
  5. 打开iPhone并通过浏览器导航到 "http://xxx.xxx.xxx.xxx/"。
    （其中 xxx.xxx.xxx.xxx 是您的IP地址）

注意：如果有必要，您必须在防火墙设置中设置权限。

29

如果您正在使用Mac -

  1. 通过USB将您的iPhone连接到Mac。

  2. 进入网络实用程序(cmd+空格并键入“网络实用程序”)

  3. 转到“信息”选项卡

  4. 单击下拉菜单，选择“ iPhone USB”，如图所示。

Network Utility, select iPhone USB

  1. 您会找到一个类似于“xxx.xxx.xx.xx”的IP地址。打开您的iPhone上的Safari浏览器，输入IP地址：端口号

    例如：169.254.72.86:3000

[注意：如果IP地址字段为空，请确保通过USB连接了您的iPhone，退出网络实用程序，重新打开并检查IP地址。]

警告：自macOS Big Sur以来，网络实用程序已弃用。

1
运行得非常好。另一个很酷的功能是，你可以使用检查器进行开发。 - gazdagergo
3
如果您无法看到IP地址，请按照以下步骤操作：1.在iPhone上打开个人热点（通过USB连接）2.关闭Mac上的WiFi。这样iPhone就会变成路由器，您将再次看到IP地址。 - gazdagergo
2
这个方法可以用，但似乎没有必要，因为使用 Mac 的 IP 地址同样有效（即：当你们都连接在同一个 WiFi 上并从上面的列表中选择 Wi-Fi（en0）时，你会得到相同的 IP 地址）。 - Tom Auger
9
当我打开网络工具时，它显示“网络工具已被弃用”。 - mesqueeb
1
是的，自从macOS Big Sur以来，网络实用工具已经被弃用，现在需要使用终端。 - tama
显示剩余2条评论
27

如果您不在同一网络上，您可以使用名为localtunnel的第三方工具

http://localtunnel.me/

它基本上通过另一台服务器路由您的内容，然后您访问该服务器。
这个问题已经在现有的答案中解决了。 - Mogsdad
22

旧问题，新简单答案。以下方法适用于我。

通过USB将您的iPhone连接到计算机上。

打开“系统偏好设置”，然后选择“共享”。

在左侧选项卡中选择“互联网共享”。这应该会在右侧显示您的互联网共享控件。

如果“互联网共享”旁边的复选框已启用，请取消选择它。

在您的互联网共享选项右侧，勾选“iPhone USB”。

通过勾选其复选框启用互联网共享。可能会弹出一个提示窗口，请确认此操作。

找到顶部附近的消息，“您本地网络上的计算机可以访问您的计算机：xxxx.local。”记下xxxx表示您的计算机名称。您将在地址栏中输入它，因此我建议将其编辑为一个简短的单词。

现在，您应该能够从xxxx.local:yyyy访问您的本地主机服务器，其中xxxx是上一步中的计算机名称，yyyy是您的服务器端口号。

非常好的更新答案，谢谢。请注意，yyyy通常是3000。 - Dror Bar
20

如果您正在使用MAMP，请在iPhone Safari浏览器中输入您的IP地址（假设为192.0.0.63），然后加上端口号8888（例如192.0.0.63:8888），您就可以在iPhone上看到本地站点。

如果您正在使用WAMP服务器，则只需在iPhone Safari浏览器中输入IP地址（假设为192.0.0.63）即可。但是不要忘记从您的WAMP服务器的httpd.conf文件中删除deny from all。如果您查找到allow from 127.0.0.1这一行的上面或下面，您会看到deny from all；只需删除这一行并重新启动WAMP服务器，就可以完成任务了。

1
MAMP的端口号取决于您在“服务器”选项卡中的设置。 - Jennie Ji
我只想添加一条注释：如果你尝试过了但没有成功，尝试将网络更改为其他不同的选项，在我的情况下，我切换到了手机的4G热点，然后它正常工作了。 - Raphaël VO
15

如果你更喜欢输入主机名而不是IP地址

第一种方法（快捷方式）：

您应该能够在iPhone上导航到http://my-macbook-pro.local/mywebsite。详见https://dev59.com/P2ox5IYBdhLWcg3wSCfk#9304094

这种方法往往有效，因为“.local”域是一个特殊保留字。

第二种方法：

请参见http://xip.io/，这是一个免费的服务，非常方便。无需配置。

然后当您浏览到http://mysite.app.192.168.1.130.xip.io（使用服务器上的浏览器或您局域网中的任何设备）时，它将显示托管在192.168.1.130上的页面。

如果您在运行存在于该IP上的Homestead，则通过浏览到带有URL端口号的http://mysite.app.192.168.1.130.xip.io:44300（即URL中的端口），会显示托管在192.168.10.10的Homestead Vagrant虚拟机上的页面。相当惊人。

第三种方法（不依赖服务，更加灵活但更复杂，并且仅在您有安装DD-WRT路由器时有效）：

如果您有一个本地服务器，托管多个不同的站点，并希望通过不同的主机名访问它们（通过iPhone），则可以执行以下操作。

  1. 更改计算机的名称为短小、有意义且易于记忆的名称，例如“RYANDESK”。
  2. 在DD-WRT路由器设置中：
    1. 在 服务 > 服务 > 静态租约 中，将您的服务器的 MAC 地址设置为指向特定 IP 地址，例如 192.168.1.108。将其主机名设置为与您之前命名计算机相同的名称。"客户租约时间" 可以设为 1440 分钟。
    2. 确保每次更改时都按下 保存 并且也按下 应用设置。（似乎“保存”不会自动应用设置。）如果出现错误，可能是因为 DD-WRT 的 GUI 设计具有误导性，并且您不必在静态租约中按“添加”。
    3. 在 DHCP 服务器 > 用户域 中，选择 "LAN & WAN"。对于 "LAN 域"，将其设置为一些短字符串，例如没有任何标点符号的缩写（例如 "xyz"）。可能避免使用单词 "local"，因为可能会发生冲突。不要使用实际的域名，如 "com"、"org"、"net" 等。
    4. 在 服务 > 服务 > DNSMasq 中，启用 DNSMasq 和 "本地 DNS" 并配置 "其他 DNSMasq 选项" 为类似以下内容：address=/project1.xyz/project2.xyz/192.168.1.108（其中 xyz 是您在之前步骤中选择的任何内容，IP 指向具体机器，而 project1 和 project2 是您想要指向这些项目各自的主机名（例如不同的 Nginx 配置）。
    5. 确保您的 HOSTS 文件没有与我们所做的任何条目冲突。如果您不知道 HOSTS 文件是什么，您可能没问题。
    6. 清除 DNS 缓存并释放和更新本地 IP。在 iPhone 上切换到和退出飞行模式以刷新那里的 DNS 缓存。
      7. 现在你可以在你的iPhone（或桌面浏览器）中浏览到http://ryandesk.xyz，并且它会解析到你本地的服务器。所以希望你已经设置好了你的Nginx或Apache或其他服务监听该主机名。
      参考链接： https://wiseindy.com/it/how-to-access-your-pcs-using-dns-names-with-dd-wrt/ http://www.howtogeek.com/69696/how-to-access-your-machines-using-dns-names-with-dd-wrt/
11

对于 Mac 用户，打开 Network Utility（您可以通过输入 cmd + space 打开 Spotlight，然后在 Spotlight 中开始输入“Network Utility”来找到它）。选择 Network Utility，在它打开的时候，您的 IP 地址将会在标签“IP Address”旁边被找到。所以基本上，有了 IP 地址，您可以访问本地 Mac 上任何开放的端口，例如如果您的网站在本地主机 localhost:3000 上运行，并且您的 IP 地址为 154.31.92.0，那么您可以从手机浏览器中简单地输入 154.31.92.0:3000 来访问该网站。

PS- 这仅在手机和计算机都连接同一网络时才适用。

这个方法很好用。在网络实用工具中，我选择了Wi-Fi而不是默认的以太网，然后我的地址变成了10.0.1.3。在我的Mac上，我有一个程序在localhost:3004运行，所以在iPad上我输入了10.0.1.3:3004，就能够查看在我的Mac本地运行的站点。对于更复杂的带有子域名的情况，比如demo.mysite.local:3004，我使用DNSMasq取得了成功，但这是一个更加复杂的过程。 - stahlmanDesign
1
当我打开网络实用工具时，它会显示“网络实用工具已被弃用”。 - mesqueeb
前往“系统偏好设置”>“网络”>“Wifi”，IP地址将显示在右侧的Wifi详细信息中。 - Antajo Paulson
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接