如何从iPhone浏览器访问在localhost上运行的网站


266

我正在一家移动网站上工作,想使用我的iPhone浏览器对其进行测试。我的Windows 7机器和iPhone在同一无线网络上。如何从iPhone访问localhost?现在,我收到404错误。


1
确保您关闭了防火墙
ajahongir

在同一网络上的另一个/移动设备上,访问:“ IP_Address:PORT ”。详细信息在下面的答案中。
Arshin

Answers:


243

从iPhone访问localhost只会进行回送/尝试连接到自身(如果支持)。

您需要做的是找到台式机的IP(例如,如果使用Windows,请转到Command Prompt并键入ipconfig或转到Network and Sharing Centre并查找)connection status

拥有IP后,只需从浏览器访问该IP,例如http://192.168.0.102

如果正在运行防火墙,则可能需要在防火墙的入站安全性中打开端口80(或网站正在运行的任何端口)。

注意:如果要在iPhone浏览器中调试应用程序,请不要忘记应用程序的端口,例如:http://192.168.0.102:3000。在此示例中,3000是ReactJS使用的默认端口


1
“从iPhone访问localhost只会进行回送/尝试连接到自身(如果支持)?”-当然可以。几乎和我的回答一样ahahahaha;)
cusspvz

1
与其他基于Unix,Symbian和Win的设备一样,iPhone也需要回环,因为某些应用程序通过TCP / IP环回地址与其他应用程序连接。几乎所有具有网络的设备都具有环回功能。
cusspvz

2
如果测试是针对wordpress的,那么我们必须http://xxx.xxx.xxx.xxx/wordpress在wordpress仪表板中将网站网址更改为。
Rajul 2013年

1
实际上,尝试将localhost:port访问到计算机上的开放端口。它适用于我的设置。
Orip

3
IINM,这不适用于调试渐进式Web应用程序,后者通常具有服务人员,因为服务人员需要https,并且需要证书。使用Android时,它会转发端口,以便您仍然可以使用localhost,因此不需要麻烦的获取证书。
马克斯·沃特曼

174

如果您使用的是Mac,请转到“系统偏好设置”>“网络”,然后使用IP地址而不是localhost。您也可以使用端口号。就我而言,我有一台运行在端口1448上的服务器,可以使用iPhone预览192.168.1.241:1448。

MacOsNetworkSettings


5
这个答案是计算机科学和视觉设计的完美平衡。做得好。
罗拉里

40
在单击Wi-Fi菜单栏项目时,按住Alt / Option键。这提供了有关您的连接的大量额外信息,包括您的本地IP地址。
威廉·罗伯逊

如果您的服务器使用虚拟主机(多个主机名)
无法

2018年:网络实用程序>信息(第一个选项卡)> IP地址(在接口信息下)-可以使用!thnku
webkit

2
要访问开发沙箱,我必须将沙箱主机更改0.0.0.0localhoststackoverflow.com/a/35419631/1054633

28

您可以尝试ngrok.io。以与localtunnel相同的原理工作。
为您的操作系统下载该应用程序。并尝试像这样运行:

对于Linux:

./ngrok http 8000

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

对于Windows:

 ngrok.exe http 8000

2
从理论上讲,这可能会回答问题,但最好在此处为将来的用户包括答案的基本部分,并提供链接以供参考。链接主导的答案可以通过link rot变为无效。
Mogsdad '16

谢谢,我编辑了答案。但是它仍然是链接主导的。但是,万一链接断开,您总是可以谷歌搜索。
Manish Gupta

28

试试这个:

  1. Windows+R
  2. 打开 cmd
  3. 运行ipconfig (旧) ifconfig (新)
  4. 检查您的无线网卡IP
  5. 转到iPhone并通过浏览器导航到“ http://xxx.xxx.xxx.xxx/ ”。
    (xxx.xxx.xxx.xxx是您的IP)

注意:您必须在防火墙设置上设置权限(如果有)。


你救了我的一天!
亚历山大

21

如果您使用的是MAMP,请在iPhone Safari浏览器中键入IP地址(例如192.0.0.63),然后输入端口号8888(例如192.0.0.63:8888),您将可以在中查看本地站点您的iPhone。

如果您使用的是WAMP服务器,则再次在iPhone Safari浏览器中键入IP地址(例如192.0.0.63)即可。但是不要忘记deny from all从WAMP服务器的httpd.conf文件中删除。如果您在allow from 127.0.0.1上方或下方寻找线,您将会看到deny from all; 只需删除此行,然后重新启动WAMP服务器,即可完成工作。


1
MAMP的端口号取决于您在“服务器”选项卡中的设置。
珍妮姬

我只想补充一点:如果您尝试了一下,但没有成功,请尝试将网络更改为其他方式,以我为例,我切换到手机的4G热点,并且该网络正常工作
Tho Vo

21

如果您使用的是Mac,

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

  2. 转到网络实用程序(cmd +空格,然后键入“网络实用程序”)

  3. 转到“信息”标签

  4. 单击显示为“ Wi-Fi”的下拉菜单,然后选择“ iPhone USB”,如图所示。

网络实用程序,选择iPhone USB

  1. 您会发现一个IP地址,例如“ xxx.xxx.xx.xx”或类似名称。在iPhone上打开Safari浏览器,然后输入IP_address:port_number

    示例:169.254.72.86:3000

[注意:如果IP地址字段为空,请确保您的iPhone通过USB连接,退出网络实用程序,再次打开它并检查IP地址。


奇迹般有效。另一个很酷的功能是您可以使用检查器进行开发。
gazdagergo,

3
如果看不到IP地址,请执行以下操作:1.打开iPhone上的个人热点(通过USB连接)2.关闭Mac上的wifi。这样,iPhone就会变成路由器,您将再次看到IP地址。
gazdagergo

这是我十多岁的唯一答案,非常感谢!
LAdams87

这可行,但是似乎不必要,因为使用Mac的IP地址也可以工作(即:当您都在同一WiFi上并且从上面的列表中选择Wi-Fi(en0)时获得的IP地址)。
汤姆·奥格


10

如果要输入主机名而不是IP地址

首选(快速方式):

您应该能够http://my-macbook-pro.local/mywebsite在iPhone上导航到。参见https://stackoverflow.com/a/9304094/470749

由于“ .local”域是一个特殊的保留字,因此这种方法趋于起作用。

第二种选择:

请参阅http://xip.io/,这是一项免费服务,非常方便。无需配置。

然后,当您浏览到http://mysite.app.192.168.1.130.xip.io(使用服务器上 LAN上任何设备上的浏览器)时,它将显示在托管的页面192.168.1.130

如果您在该IP所在的计算机上运行Homestead,请浏览至http://mysite.app.192.168.1.130.xip.io:44300(URL中带有端口)以某种方式显示托管在的Homestead Vagrant虚拟机192.168.10.10。相当了不起。

第三选项(不依赖于服务,它很灵活,但是更复杂,并且只有在具有DD-WRT的路由器上才有效):

如果您有一台本地服务器托管要通过不同主机名(通过iPhone)访问的多个不同站点,则可以执行此操作。

  1. 在您的操作系统中,将计算机的名称更改为简短,有意义且易于记忆的名称,例如“ RYANDESK”。
  2. 在DD-WRT路由器设置中:
    1. 在中Services > Services > Static Leases,将服务器的MAC地址设置为指向特定的IP地址,例如192.168.1.108。将其主机名设置为与您先前命名的计算机相同。“客户租赁时间”可以为1440分钟。
    2. 请务必按Save,并Apply Settings进行所有更改。(“保存”似乎并不会自动应用设置。)如果出现错误,则可能是因为DD-WRT的GUI设计具有误导性,并且您不必要按“添加”获取“静态租赁”。
    3. 在中DHCP Server > User Domain,选择“ LAN&WAN”。对于“ LAN域”,将其设置为一些短字符串,例如没有任何标点符号的首字母(例如“ xyz”)。可能避免使用“本地”一词,因为可能存在冲突。不要使用现实世界中的域,例如“ com”,“ org”,“ net”等。
  3. 在中Services > Services > DNSMasq,启用DNSMasq和“ Local DNS”,并将“ Additional DNSMasq Options”配置为类似以下内容address=/project1.xyz/project2.xyz/192.168.1.108:(在xyz上一步中选择的位置,IP指向特定计算机,project1并且project2是要指向的主机名每个项目(例如不同的Nginx配置)。
  4. 确保您的HOSTS文件中没有任何与我们所做的冲突的条目。如果您不知道什么是HOSTS文件,则可能很好。
  5. 刷新DNS缓存,然后释放并更新本地IP。在iPhone上切换进出飞行模式,以在那里也刷新DNS缓存。
  6. 现在,您可以http://ryandesk.xyz在iPhone(或桌面浏览器)中浏览到,它将解析为您的本地服务器。因此,希望您已经设置了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-您的机器使用带有dd-wrt的DNS名称/


6

对于Mac用户,请打开“网络实用程序”(您可以通过键入cmd + space来找到它,这将打开Spotlight,然后在Spotlight中开始键入“ Network Utility”)。选择网络实用程序,将其打开时,您的IP地址将在标签IP地址旁边找到。因此,基本上,有了IP,您就可以进入本地Mac上的任何开放端口,例如,如果您的网站在localhost:3000上本地运行,并且您的IP地址为154.31.92.0,那么从您的电话中,您只需输入154.31即可获得该网站。 92.0:3000进入浏览器。

PS-仅在电话和计算机都在同一网络上时才有效


这很棒。在Network Utility中,我选择了Wi-Fi而不是默认的以太网,然后我的地址是10.0.1.3。在Mac上,我有一个程序运行在localhost:3004上,因此在iPad上,键入10.0.1.3:3004,就可以查看在Mac上本地运行的站点。对于带有子域的更复杂的情况,例如demo.mysite.local:3004,我使用DNSMasq取得了成功,但这是一个更复杂的过程。
stahlmanDesign

5

iPhone的WebpackDevServer本地主机

如果您使用的是在节点上运行的应用程序。您可以将webpack用作构建工具,并使用其内置的devserver

您可以使用webpackdevserver从本地主机服务器启动应用程序,然后传入您所选的本地主机地址和端口。

webpack-dev-server --host 192.168.0.89 --port 3000

然后可以从您的iPhone使用

http://192.168.2.89:3000

注意::您的笔记本电脑和iPhone应该在同一网络上,并且您应该使用本地ip地址。

对于Mac,如何查找IP地址,您可以参考在node.js中获取本地IP地址


5

如果您使用的是Mac(OSX):

在您的Mac上:

  1. 开放终端
  2. 运行“ ifconfig”
  3. 找到IP地址为“ 192.xx.xx”的行

如果您正在使用以下地址测试您的网站:“ localhost:8888 / mywebsite”(取决于您的MAMP配置)

在手机上:

  1. 打开浏览器(例如Safari)
  2. 输入URL 192.xxx.xx:8888 / mywebsite

注意:您必须连接到同一网络(wifi)


3

您可以使用计算机的IP代替http:// localhost

但是它可能无法访问。您必须编辑httpd.conf服务器软件(或等效配置文件)。我现在没有安装php,但是您可以使用关键字搜索:“允许来自或/ Directory”

注意:运行XAMPP的PC的IP应该是静态IP(不是由DHCP分配的),否则,每次重新启动PC时都必须手动检查它。


3

我想完成与原始请求相同的操作,并在此处寻找答案,并关闭了所有防火墙和病毒防护都无济于事。

然后,我在Microsoft文档中发现了有关IIS Express的以下陈述:“ IIS Express不会将请求提供给另一台计算机上的浏览器,从而使其在企业环境中的批准更加容易”。

底线-您将必须安装IIS(而不是交付的IIS Express)才能在计算机外部看到您的项目。

来源:http//msdn.microsoft.com/en-us/library/58wxa9w5.aspx

希望这对那些会关闭计算机上每个安全功能的人有所帮助。


2

如果您正在处理php项目,则可以更改基本href:

<base href="<?php echo str_replace("localhost","192.x.x.x",HTTPS_SERVER);?>">

  • 本地主机或127.0.0.1:取决于您的设置
  • 192.xxx:您的本地IP地址
  • HTTPS_SERVER:先前的基本href

这样做对于在手机上加载图像,css和js文件至关重要。


2

WAMP

1)您应该单击WAMP图标>联机(等待直到重新启动)。

2)然后(如果您是同一网络上Iphone上的WiFi),请在iPhone浏览器中打开IP

http://192.168.1.22 http://164.92.124.42

要查找本地IP:
a)单击开始>运行> cmd并键入ipconfig,然后您将在此处看到。

b)单击蓝色箭头, “租赁新IP”。

ps就是这样。现在您可以从AndroidiPhone访问(打开)本地主机


2

对于使用正确IP地址并且仍然无法连接到本地服务器的用户,需要检查的另一件事是您或您的同事未将设备配置为使用代理服务器。

我有一台无法连接的设备,结果证明该设备配置为使用Charles Proxy,而后者当然没有运行。


2

找到系统的IP地址以及port正在运行的网站。

假设您的IP地址是121.300.00.250,端口是8080

[端口号:运行页面时查看您的Web浏览器,例如:localhost:8080 / ...,则端口号为8080]

现在在您的手机中转到 121.300.00.250:8080/..,您将找到您的网站。

重要提示:您必须确保服务器(例如Apache Tomcat)处于启动状态


1

看看这个答案,它讨论通过直接的Objective-C调用在内部路由HTTP到支持HTTP的层/嵌入式Web服务器(假设HTTP服务器代码在希望在Web中显示HTML的同一应用程序内)小部件)。

这样做的优点是安全性更高(并且可能更快),因为不应暴露任何端口。


1

如果您选择进入“网络设置”并获取Wi-Fi IP地址(例如xxx.xxx.x.xxx:9000(:9000或任何打开的端口))的路线,请确保您的移动设备也位于同一Wi -Fi /信号IP地址。我花了一天的时间试图使其正常工作,直到我将手机从蜂窝网络切换到相同的Wi-Fi连接/ IP地址后,该方法才起作用。我进行此更新后立即打开。


关闭移动数据对我来说无异。谢谢!
安迪·斯图尔特

1

有一个非常简单的方法可以实现此目的:

  1. 将手机和计算机连接到同一局域网。
  2. Window + R,然后输入 ipconfig,然后得到您当前的ip ip地址,看起来像这样:192.168.XX.XX
  3. 在电话网络浏览器中使用您的应用程序端口键入此ip,如下所示:http://192.168.XX.XX:8080,它可以正常工作

注意:

如果那没有用。关闭PC中的防病毒软件,如果仍然无法正常工作,请尝试关闭Windows防火墙,因为此问题与PC防火墙有关。


1

脚步:

我假设您已经启动了Web服务器(默认端口为8080的Apache Tomcat)。

在Windows 10上:

  1. 打开您的防病毒软件,转到“防火墙”部分,然后找到“端口”部分,然后添加一个本地TCP / IP端口:8080以允许访问
  2. 从命令提示符获取机器的IP地址。(IPv4地址)
  3. 从iPhone启动Chrome,然后转到ip地址:8080地址。

希望这可以帮助。


0

我想从我的iPhone浏览Windows 8笔记本电脑上IIS服务器上托管的网站。经过一番阅读之后,我打开了Windows防火墙,选择了“允许应用程序或功能通过Windows防火墙”。然后向下滚动并从列表中选中“万维网服务(HTTP)”。仅此而已,它奏效了。希望它也能帮助其他人。


0

以我为例,首先我将PC和手机连接到同一网络,则可以从PC ping手机以测试连接。

我在本地使用GGTS(Groovy / Grails工具套件)运行我的项目,然后使用PC IP地址从移动设备访问网站,效果很好。

PS。从本地运行,它将提供类似(http:// localhost:8080 / projectname)的url,如果您尝试从移动设备访问本地网站,则应使用PC IP地址替换localhost



0

在Mac上执行此操作的另一种快速而又肮脏的方法是打开xcode(如果已安装)并在模拟器上运行safari。localhost在这里键入也将起作用。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.