最直接的区别,很容易注意到,一个是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下的文件。

HTML文件直接在浏览器打开和本地服务器localhost打开有什么区别?的更多相关文章

  1. sublime text3在指定浏览器上本地服务器(localhost)运行文件(php)

    昨天在使用sublime text3时,发现能在本地服务器上运行php文件,于是百度了一下有关知识, 终于成功了,今天总结一下. 首先要让sublime text3 出现侧边栏sidebar,不会的可 ...

  2. [转]sublime text3在指定浏览器上本地服务器(localhost)运行文件(php)

    昨天在使用sublime text3时,发现能在本地服务器上运行php文件,于是百度了一下有关知识, 终于成功了,今天总结一下. 首先要让sublime text3 出现侧边栏sidebar,不会的可 ...

  3. 在使用webstorm打开本地项目文件夹的html文件时,浏览器提示404错误

    错误原因:在使用webstorm打开本地项目文件夹的html文件时,浏览器提示404错误. 错误分析:文件夹命名内包含“+”,此特殊符号导致浏览器解析错误. 改正方案:去掉特殊符号“+”

  4. android -------- 打开本地浏览器或指定浏览器加载,打电话,打开第三方app

    开发中常常有打开本地浏览器加载url或者指定浏览器加载, 还有打开第三方app, 如 打开高德地图 百度地图等 在Android程序中我们可以通过发送隐式Intent来启动系统默认的浏览器. 如果手机 ...

  5. 快捷键让SublimeText在编文件快速在浏览器打开

    这里插入一下安装"view in browser"官方版的说明:(前提是得先安装package control插件) 1.通过"ctrl+shift+p"打开命 ...

  6. MyWebViewDemo【封装Webview常用配置和选择文件、打开相机、录音、打开本地相册的用法】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 封装webview的常用配置和选择文件.打开相机.录音.打开本地相册的用法.[如果想要使用简单的预览功能,可以参考<MyBri ...

  7. 用java打开一个本地文件

    以下有三种方式打开 /** * 借助java.awt.Desktop打开 * @see 打开的目录或文件名中允许包含空格 */ private static void useAWTDesktop() ...

  8. webpack热加载:修改文件自动刷新浏览器并更新

    概述 之前用react脚手架,觉得那种修改了能立即自动刷新浏览器并更新的功能实在非常人性化,所以想在开发其它项目的时候能用上.于是查了一些资料记录在此,供以后开发时参考,相信对其他人也有用. 其实代码 ...

  9. 通过html页面打开Android本地的app

    http://www.cnblogs.com/yejiurui/p/3413796.html 一.通过html页面打开Android本地的app 1.首先在编写一个简单的html页面 <html ...

随机推荐

  1. 退役III次后做题记录(扯淡)

    退役III次后做题记录(扯淡) CF607E Cross Sum 计算几何屎题 直接二分一下,算出每条线的位置然后算 注意相对位置这个不能先搞出坐标,直接算角度就行了,不然会卡精度/px flag:计 ...

  2. UltraISO 下载

    链接:https://pan.baidu.com/s/1Wf0TmB8L9falKyGu8NwvBw 提取码:1cu8 参考: https://jingyan.baidu.com/article/cb ...

  3. ios 报错 Invalid row height provided by table delegate. Value must be at least 0.0, or UITableViewAutomaticDi......

    Invalid row height provided by table delegate. Value must be at least 0.0, or UITableViewAutomaticDi ...

  4. OSPF协议介绍及配置

    一.OSPF概述 回顾一下距离矢量路由协议的工作原理:运行距离矢量路由协议的路由器周期性的泛洪自己的路由表,通过路由的交互,每台路由器都从相邻的路由器学习到路由,并且加载进自己的路由表中,而对于这个网 ...

  5. JFinal 数据库“手动”事务(提交、回滚)

    一.用注解 @Before(Tx.class) 实现 事务回滚 @Before(Tx.class) public void pay() throws Exception { //throws exce ...

  6. ubuntu连接多个realsense d435

    ubuntu连接多个realsense d435 import pyrealsense2 as rs import numpy as np import cv2 import time import ...

  7. 【GMT43智能液晶模块】例程二十一:DMA LAN实验——高速数据传输测速

    源代码下载链接: 链接:https://pan.baidu.com/s/1wQomZvOUP9_ZslZus_NSIA 提取码:3fmf 复制这段内容后打开百度网盘手机App,操作更方便哦 GMT43 ...

  8. HDFS java API TROUBLESHOOTING

    官方文档:https://hadoop.apache.org/docs/r2.9.2/hadoop-project-dist/hadoop-common/SingleCluster.html 配置免密 ...

  9. 审阅模式中word保存不了

    word保存不了 觉得有用的话,欢迎一起讨论相互学习~Follow Me 昨天写论文出现一个怪事,发现自己word内容按ctrl+S 进行保存时可以的,但是当按X进行关闭时,出现 关闭不了,问我是否需 ...

  10. sql 在查询到的语句基础上添加行号

    正常查询语句: SELECT TagName FROM ps_status a WHERE a.TagName LIKE "DTmk_zybf%1bxxjcqh.PV" 查询结果: ...