HTML文件直接在浏览器打开和本地服务器localhost打开有什么区别?

最直接的区别,很容易注意到,一个是file协议,另一个是http协议

file协议更多的是将该请求视为一个本地资源访问请求,和你使用资源管理器打开是一样的,是纯粹的请求本地文件。

http请求方式则是通过假架设一个web服务器,解析http协议的请求然后向浏览器返回资源信息。我们所开发的html文件最后必定是会以网页的形式部署在服务器上,通过http协议访问,所以我们开发中也尽可能模拟线上环境,架设本地服务器,来避免file协议与http协议实现过程中的某些差异,如某些API的差异、跨域请求的差异等。举个最容易验证的例子:在页面引入一张绝对路径的图片,即’/image/example.png’,然后分别通过这两种方式打开页面,file协议会将资源请求到根路径,而http协议虽然也会请求到根路径,但是是相对本地架设的服务器的根路径,一般也就是项目文件夹的路径。

访问服务器上的html文件是以http的协议方式去打开,有网络交互。

直接打开html文件是以file协议的方式去打开,没有网络交互。

浏览器对两种协议的处理有时会不同,譬如某些网页中直接调用file协议来打开图片,这样的功能会被浏览器的安全设置阻挡。因为默认上,html是运行于客户端的超文本语言,从安全性上来讲,服务端不能对客户端进行本地操作。即使有一些象cookie这类的本地操作,也是需要进行安全级别设置的。

启动http服务

这里举例Python3,Python自带一个微型的http服务,可以通过命令行启动:

python3 -m http.server 

然后这个服务启动后,在浏览器输入localhost:8000即可。显示的内容是基于你启动服务时所在的路径下的文件。
比如,你在/home/linux/ubuntu这个路径下执行的命令,那么网页显示的就是ubuntu下的文件。

转载于:https://www.cnblogs.com/cpl9412290130/p/11607495.html

  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 可以使用支持HTTP服务器的软件来在本地服务器打开HTML文件,例如Apache、Nginx等。另外,也可以使用Node.js的模块,例如http-server来搭建一个简易的HTTP服务器,然后打开本地的HTML文件。 ### 回答2: 要在本地服务器打开html文件,而不是在文件夹内直接打开,可以按照以下步骤操作: 1. 安装一个本地服务器软件,比如XAMPP、WampServer、MAMP等。这些软件都提供了Apache服务器以及相应的PHP和MySQL支持。 2. 将你的html文件复制到服务器软件的相关文件夹中。不同的本地服务器软件可能有不同的文件夹位置。通常,在安装目录中有一个名为"htdocs"或"www"的文件夹,你可以将你的html文件放在这个文件夹中。 3. 启动本地服务器软件。打开软件,启动Apache服务器。 4. 在浏览器中输入"localhost"或"127.0.0.1"来访问本地服务器。 5. 在浏览器地址栏输入"http://localhost/你的html文件名.html",然后按下回车键。 6. 就会在浏览器打开你的html文件,并在本地服务器上运行。 通过上述步骤,你可以在本地服务器打开html文件,并且可以通过浏览器访问这个文件。这样做的好处是,服务器可以提供更多的功能,比如PHP和数据库支持,同时也更加符合网站开发的需求。 ### 回答3: 要在本地服务器打开HTML文件,而不是直接文件夹中打开,你需要按照以下步骤进行操作: 1. 首先,确保你已经安装了一个本地服务器环境,比如使用Apache或Nginx等服务器软件。 2. 将你的HTML文件放置在服务器的根目录下,通常在服务器软件的安装目录中可以找到一个叫做"htdocs"或"www"的文件夹。将HTML文件放在此文件夹内。 3. 启动本地服务器打开你的服务器软件,启动服务器服务。 4. 在浏览器中输入本地服务器的地址。通常默认情况下,你可以在浏览器的地址栏中输入"http://localhost"来访问本地服务器。 5. 输入HTML文件的路径。根据你的文件结构,输入HTML文件的路径来访问它。例如,如果你的HTML文件名为index.html,它位于服务器根目录下,则在浏览器中输入"http://localhost/index.html"即可打开文件。 通过按照上述步骤,你将能够在本地服务器打开HTML文件,这样可以运行其中的脚本和样式,并查看在服务器环境中的效果。这对于开发和测试网页或网站非常有用。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值