最直接的区别,很容易注意到,一个是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. 用户生命周期(User Lifetime)

    什么是用户生命周期? 用户生命周期是从用户开始接触产品到离开产品的整个过程.用户生命周期可分为:引入期.成长期.成熟期.休眠期.流失期.对应的是用户对产品不同的参与程度. 用户生命周期有什么用? 按照 ...

  2. python 判断元素是否在一个列表中

    import random val= data=[,,,,] : find=False val=int(input('请输入查找键值(1-9),输入-1离开:')) for i in data: if ...

  3. 《京东B2B业务架构演变》阅读笔记

    一.京东 B2B 业务的定位 让各类型的企业都可以在京东的 B 平台上进行采购.建立采购关系. 京东 B2B 的用户群体主要分为 2 类: 一类是大 B 用户.另一类是小 B 用户.京东 B 平台需要 ...

  4. C#控制台程序入口函数 Main(string[] args) 参数详解

    学习C#编程最常见的示例程序是在控制台应用程序中输出Hello World! using System; namespace DemoMainArgs { class Program { static ...

  5. Java编程思想之九 接口

    接口和内部为我们提供了一种将接口与实现分离的更加结构化的方法. 抽象类和抽象方法 创建一个抽象类是希望通过这个通用接口操纵一系列类. Java提供了一个叫做抽象方法的机制,这种方法是不完整的:仅声明而 ...

  6. mstar gdb调试

    当进程崩溃出现coredump提示时,可以利用gdb来定位出错函数. 首先,把core_dump.XXX.gz文件从设备上拷贝出来,放到编译环境下,另外,还要把代码目录下的symbols文件夹也拷贝到 ...

  7. vi编辑器操作 快捷键

    vi编辑器操作 快捷键 1. 命令模式 与 编辑模式切换 a:光标向后移动一位进入编辑模式 i:光标和内容 没有变化进入编辑模式 o:新起一行进入编辑模式 s:删除光标所在字符进入编辑模式       ...

  8. TortoiseGit用户名密码的更换方法介绍

    http://www.downza.cn/xy/53171.html 有时候因实际需求要更换TortoiseGit用户名密码,怎么办呢?下文就是TortoiseGit用户名密码的更换方法介绍,一起看看 ...

  9. 【Eclipse】Eclipse如何导出java项目为jar包

    1.首先确定要导出的项目 从项目结构可以看出,笔者的项目是一个Dynamic Java Project.com/db下面有一个config的数据库配置文件.WEB-INF/lib文件夹下面有依赖的ja ...

  10. tensorflow 笔记 15:如何使用 Supervisor

    如何使用Supervisor在不使用Supervisor的时候,我们的代码经常是这么组织的 variables ... ops ... summary_op ... merge_all_summari ...