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下的文件。
HTML文件直接在浏览器打开和本地服务器localhost打开有什么区别?的更多相关文章
- sublime text3在指定浏览器上本地服务器(localhost)运行文件(php)
昨天在使用sublime text3时,发现能在本地服务器上运行php文件,于是百度了一下有关知识, 终于成功了,今天总结一下. 首先要让sublime text3 出现侧边栏sidebar,不会的可 ...
- [转]sublime text3在指定浏览器上本地服务器(localhost)运行文件(php)
昨天在使用sublime text3时,发现能在本地服务器上运行php文件,于是百度了一下有关知识, 终于成功了,今天总结一下. 首先要让sublime text3 出现侧边栏sidebar,不会的可 ...
- 在使用webstorm打开本地项目文件夹的html文件时,浏览器提示404错误
错误原因:在使用webstorm打开本地项目文件夹的html文件时,浏览器提示404错误. 错误分析:文件夹命名内包含“+”,此特殊符号导致浏览器解析错误. 改正方案:去掉特殊符号“+”
- android -------- 打开本地浏览器或指定浏览器加载,打电话,打开第三方app
开发中常常有打开本地浏览器加载url或者指定浏览器加载, 还有打开第三方app, 如 打开高德地图 百度地图等 在Android程序中我们可以通过发送隐式Intent来启动系统默认的浏览器. 如果手机 ...
- 快捷键让SublimeText在编文件快速在浏览器打开
这里插入一下安装"view in browser"官方版的说明:(前提是得先安装package control插件) 1.通过"ctrl+shift+p"打开命 ...
- MyWebViewDemo【封装Webview常用配置和选择文件、打开相机、录音、打开本地相册的用法】
版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 封装webview的常用配置和选择文件.打开相机.录音.打开本地相册的用法.[如果想要使用简单的预览功能,可以参考<MyBri ...
- 用java打开一个本地文件
以下有三种方式打开 /** * 借助java.awt.Desktop打开 * @see 打开的目录或文件名中允许包含空格 */ private static void useAWTDesktop() ...
- webpack热加载:修改文件自动刷新浏览器并更新
概述 之前用react脚手架,觉得那种修改了能立即自动刷新浏览器并更新的功能实在非常人性化,所以想在开发其它项目的时候能用上.于是查了一些资料记录在此,供以后开发时参考,相信对其他人也有用. 其实代码 ...
- 通过html页面打开Android本地的app
http://www.cnblogs.com/yejiurui/p/3413796.html 一.通过html页面打开Android本地的app 1.首先在编写一个简单的html页面 <html ...
随机推荐
- To ssh://xxx.com:8022/test/project.git ! [remote rejected] master -> master (pre-receive hook declined) error: failed to push some refs to 'ssh://xxx.com:8022/test/project.git'
To ssh://xxx.com:8022/test/project.git ! [remote rejected] master -> master (pre-receive hook dec ...
- Pytorch中ndarray tensor list互转
1.ndarray->tensor : b=torch.from_numpy(a) 2.tensor->ndarray: b=a.numpy() ''' 但这么写会报错-- Runtime ...
- HTTPS加密协议过程
1.客户端发起https请求 指用户在浏览器中输入一个https网址,然后链接到server的443端口 2.服务端的配置 在服务端向CA机构申请SSL数字证书.SSL证书就是一对公钥和私钥.公钥相当 ...
- 多catch块的代码优化
一.多catch块的代码优化 在写代码时,多行存在不同的异常,使用try catch的话,习惯性的是有多个catch,如下所示: 注意到warning,文字描述如下: Reports identica ...
- 【技术博客】 关于laravel5.1中文件上传测试的若干尝试
关于laravel5.1中文件上传测试的若干尝试 作者:ZGJ 版本:v1.0 PM注:本人这两天也正在尝试解决这一问题,如有进展将及时更新这一博客 在我们的软工第二阶段中,我开始着手进行后端控制器的 ...
- CloudFlare上线了新的Proxy Anything选项, 支持转发TCP连接
https://www.nicho1as.wang/articles/cf-proxy-anything.html 申请地址:https://goo.gl/forms/Oc2jyyo0kXsrMyw3 ...
- Spring Boot Controller单元测试
一.创建Controller 一个方法是用传统IO来下载文件,一个是NIO下载文件 @Controller public class FileController { private Logger l ...
- PHP 命令行参数解析工具类
<?php/** * 命令行参数解析工具类 * @author guolinchao * @email luoyecb@163.com */class CommandLine{ // store ...
- Centos 7.x卸载ibus黑屏修复及fcitx搜狗拼音安装方法
ibus黑屏修复 百度出来的fcitx安装方法,都要卸载ibus,如果没有注意同时卸载掉的依赖包的话,gnome桌面中的一些关键库也没被卸载. 修复方法很简单,重新安装Gnome sudo yum - ...
- Error-ASP.NET:未能加载文件或程序集“CMSCalendar”或它的某一个依赖项。系统找不到指定的文件。
ylbtech-Error-ASP.NET:未能加载文件或程序集“CMSCalendar”或它的某一个依赖项.系统找不到指定的文件. 1.返回顶部 1. “/”应用程序中的服务器错误. 分析器错误 说 ...