这代表着我们 web 端有了和原生 APP 媲美的能力。...这里主要探究一下另外两个技术 Push 和 Notification。首先,有一个问题,这两个技术是用来干嘛的呢?...Push && Notification 这两个技术,我们可以理解为就是 server 和 SW 之间,SW 和 user 之间的消息通信。...这里,我们先来讲解一下 notification的相关技术。 Notification 那现在,我们想给用户发送一个消息的话应该怎么发送呢?...比如,国外的飞机延迟通知网页: 让用户来决定是否进行推送 因为用户不是技术人员,我们需要将一些接口,暴露给用户。
Web攻击技术 1、针对Web的攻击技术 1.1、在客户端即可篡改请求 在Web应用中,从浏览器那接收到的Http的全部内容,都可以在客户端自由地变更、篡改,所以Web应用可能会接收到与预期数据不相同的内容...在Http请求报文内加载攻击代码,就能发起对Web应用的攻击。...1.2、针对Web应用的攻击模式 以服务器为目标的主动攻击 主动攻击是指攻击者通过直接访问Web应用,把攻击代码传入的攻击模式,具有代表性的攻击时SQL注入攻击和OS命令注入攻击。...应用使用的数据库,通过运行非法的SQL而产生的攻击。...SQL注入攻击有可能会造成以下等影响: 非法查看或篡改数据库内的数据 规避认证 执行和数据库服务器业务关联的程序等 2.3、OS命令注入攻击 OS命令注入攻击(OS Command Injection)
.html 页面,其中包含 css 等前端技术。...随着 Web 的发展,信息要双向流动,产生了交互的 需求,也就是动态网页的概念;所谓动态就是利用 flash、Php、asp、Java 等技术在网页中 嵌入一些可以运行的脚本,用户浏览器在解释页面时,遇到脚本就启动运行它...,采用 的专业的数据库。...Web 开发者在 Web 服务器后边增加了一个数据库服务器,这些经常变动的数据被存进数 据库,可以随时更新。...当用户请求页面时,脚本根据用户请求的页面,涉及到动态数据的地 方,利用 SQL 数据库语言,从数据中读取最新的数据,生产“完整”页面,最后送给用户。
站点页面性能提升可以使得用户浏览站点时的体验得到良好改善,作为其中一条技术分支,移动Web加速技术的方法和技术方案在近几年得到了不断发展。...无论是内容分发平台、浏览器提供商、网络提供商还是Web站点,都在通过各种各样的移动Web加速技术为用户提供更良好的页面浏览体验。 移动Web加速技术有哪些方向?...开始的前言内容中我们已经提到,参与移动Web生态的几个重要角色分别是内容分发平台、浏览器提供商和网络提供商以及Web站点。每个角色都在自己所擅长的领域通过技术创新来给用户提供更快速的移动Web体验。...因此,移动Web加速的几个技术方向也和几个重要参与者的角色职能密不可分。 比较重要的技术方向分别是: 1. 页面加载与缓存 移动Web加速的其中一个重要技术方向是针对页面加载和缓存相关的加速技术。...此项技术的思路是从Web服务提供者角度来提供更好的网络环境来进行移动Web加速。在此就不做更多的介绍。
Web 的攻击技术.png Web 的攻击技术 针对 Web 的攻击技术 简单的 HTTP 协议本身并不存在安全性问题,因此协议本身几乎不会成为攻击的对象 在运作的 Web 应用背后却隐藏着各种容易被攻击者滥...用的安全漏洞的 Bug 在 Web 应用中,从浏览器那接收到的 HTTP 请求的全部内容,都可以在客户端自由地变更、篡改 在 HTTP 请求报文内加载攻击代码,就能发起对 Web 应用的攻击 主动攻击...(active attack)是指攻击者通过直接访问 Web 应用,把攻击代码传入的攻击模式 被动攻击(passive attack)是指利用圈套策略执行攻击代码的攻击模式。...显示伪造的文章或图片 跨站脚本攻击案例 在动态生成 HTML 处发生 对用户 Cookie 的窃取攻击 SQL 注入(SQL Injection)是指针对 Web 应用使用的数据库,通过运行非法的 SQL...非法查看或篡改数据库内的数据 规避认证 执行和数据库服务器业务关联的程序等 OS 命令注入攻击(OS Command Injection)是指通过 Web 应用,执行非法的操作系统命令达到攻击的目 的
但今天一看,在我们团队,前端工程师超过一半的工作都是在做移动端的Web或者APP的开发。...移动Web或者APP在技术本质上是和做桌面端Web没有本质区别,但是移动端的坑那是非常的多,通过学习这部分内容,让你成为一名桌面移动通吃的前端开发工程师。...概念 参考: 移动 Web 开发入门 上面这个 slide 资料讲的非常好,算是一个入门的介绍吧。带我们建立基本的移动 web 开发知识体系和常见问题的实践。...所以,在我们的课程中,主要让你了解整个性能优化都涉及哪些方面的工作,同时,我们会专注介绍一些在前端领域可以重点关注的技术点。 这里就是网页的打开速度,如果你的网页打开速度很慢,那么一定会有用户的流失。...ToDo WebApp Version 任务四要求 源代码 在线 demo 我的博客 HyG Details 数据存储 使用数据库的思想,构建3张表。
作者 | Jeskson 来源 | 达达前端小酒馆 web的概念 web叫全球广域网,可以叫做万维网,是一种分布式结构,建立在Internet上的网络服务。...URL是统一资源定位符,URL是一个网页的地址,web浏览器通过URL从web服务器请求页面。...web数据交互技术 web数据交互,我们做一个网站时分为前台和后台,前台是前端开发者开发的,后端即数据是后端开发者开发的。...ajax是一种无须重新加载整个页面,就能够更新网页的技术,它是一种异步的JavaScript和xml技术。 ajax可以实现网页的异步更新,可以不重新加载整个网页,就可以对网页的部分内容进行更新。...~ 大前端开发,定位前端开发技术栈博客,PHP后台知识点,web全栈技术领域,数据结构与算法、网络原理等通俗易懂的呈现给小伙伴。谢谢支持,承蒙厚爱!!!
快速入门 JavaScript 指南 中级教程 高级 内置对象 表达式和运算符 语句和声明 函数 Classes Errors 更多 Ne...
作者:fransli,腾讯 PCG 前端开发工程师 Web 水印技术在信息安全和版权保护等领域有着广泛的应用,对防止信息泄露或知识产品被侵犯有重要意义。...水印根据可见性可分为可见水印和不可见水印(盲水印),本文将分别予以介绍,带你探秘 web 水印技术。...Shadow DOM 在 Chrome 逐步统治浏览器江湖之后,谷歌正野心勃勃的推广 Web Components 技术。该技术允许在 Web 中创建可重用的小部件或组件。...不可见水印(盲水印)属于信息隐匿技术(也叫隐写术),历史悠久,手段繁多。在现代,随着计算机网络技术的发展,数字产品的信息安全和版权保护也已成为信息隐匿技术的一个重要课题。...Reference Web Components shadow DOM 如何让文字作为 CSS 背景图片显示? 《数字图像隐写分析》 《数字图像处理原理与实践》 《数据隐藏技术揭秘》
常见Web攻击技术 一、跨站脚本攻击 概念 跨站脚本攻击(Cross-Site Scripting, XSS),可以将代码注入到用户浏览的网页上,这种代码包括 HTML 和 JavaScript 攻击原理...alert(/xss/); </script> XSS 过滤在线测试 二、跨站请求伪造 概念 跨站请求伪造(Cross-site request forgery,CSRF),是攻击者通过一些技术手段欺骗用户的浏览器去访问一个自己曾经认证过的网站并执行一些操作...三、SQL 注入攻击 概念 服务器上的数据库运行非法的 SQL 语句,主要通过拼接来完成。
摘自 前端小吉米 伴随着今年 Google I/O 大会的召开,一个很火的概念--Progressive Web Apps 诞生了。这代表着我们 web 端有了和原生 APP 媲美的能力。...这里主要探究一下另外两个技术 Push 和 Notification。首先,有一个问题,这两个技术是用来干嘛的呢?...Push && Notification 这两个技术,我们可以理解为就是 server 和 SW 之间,SW 和 user 之间的消息通信。...这里,我们先来讲解一下 notification 的相关技术。 Notification 那现在,我们想给用户发送一个消息的话应该怎么发送呢?...比如,国外的飞机延迟通知网页: undefined 让用户来决定是否进行推送 因为用户不是技术人员,我们需要将一些接口,暴露给用户。
目录 JWT简介 JWT数据结构 JWT头部 JWT有效载荷 JWT签名 JWT用法 JWT验证流程 JWT问题与趋势 JWT安全风险 JWT简介 Web服务使用最多的认证方式是基于Session的认证...但是,如果它是服务器集群或面向服务的跨域体系结构的话, 则需要一个统一的session数据库来保存session会话数据实现共享, 这样负载均衡下的每个服务器才可以正确的验证用户身份。...一种解决方案是听过持久化session数据,写入数据库或文件持久层等。 收到请求后,验证服务从持久层请求数据。...而且由于依赖于持久层的数据库或者问题系统,会有单点风险, 如果持久层失败,整个认证体系都会挂掉。 那么,JWT(Json Web Token)诞生了!...善用JWT有助于减少服务器请求数据库的次数。 4、JWT的最大缺点是服务器不保存会话状态, 所以在使用期间不可能取消令牌或更改令牌的权限。 也就是说,一旦JWT签发,在有效期内将会一直有效。
2.2.3 应用缓存与PWA 应用缓存全称为Offline Web Application,它的缓存内容被存在浏览器的Application Cache中。...PWA全称是渐进式网络应用,主要目标是实现web网站的APP式功能和展示。尽管PWA也有manifest文件,但是与应用缓存却完全不同。
前端领域的发展非常迅猛,大前端的时代到来了,据说每隔12-24个月,前端的难度将增加一倍,从下面的技术栈就可以看出前端领域的丰富度和复杂度 核心概念 HTML |-- DOM |-- Element |...CommonJS |-- webpack |-- browserify |-- AMD |-- RequireJS |-- UMD |-- umd WebSocket |-- Socket.io |-- web-socket-js
1.技术体系 1.1技术体系整理 其中绿色底色的代表Demo中表现出的能力比较成熟,可以直接应用。...token=55695cff60c6e275 1.2 兼容性 Web AR的兼容性,可以认为是其用到两大核心技术的兼容性: WebRTC: WebGL: 1.3案例分析 公司的王者荣耀貂蝉AR广告,...《Web前端也能做的AR互动》 实际上就是一个基于Three.js渲染模型,并自行基于Three.js实现空间定位的一个AR应用。...AR业界已经有了一定的技术积累,但是还没有达到成熟可用的地步,用一句话概括一下:底层识别能力弱,上层渲染能力强。...3.2上层渲染 模型渲染,目前看到的Web中主流3D模型渲染方式是Three.js,做Web AR方面的开发,无论底层能力采用何种方案,都是必须系统学习一下Three.js的。
框架提供的,比如访问数据库、模板引擎和其他系统的接口,都是一个附加功能。...首先,这是一个阻塞框架,这意味着如果我们的请求需要几秒钟才能被服务(例如,客户端从一个非常慢的数据库检索数据),那么任何其他请求都必须排队等待服务。...技术的一个重要方面是:随着新的、(希望是)更好的解决方案的普及,它会随着时间的推移而改变。...,并与非关系数据库(如DynamoDB)连接。...(未完,待续) 阅读链接 剖析Web技术栈(一) 剖析Web技术栈(二) 参考资料 [1] Miguel Gringberg's amazing Flask mega-tutorial: https:
构建 Web 内容的技术 构建 Web 内容的技术.png HTML HTML5 标准不仅解决了浏览器之间的兼容性问题,并且可把文本作为数据对待,更容易复用,动画等效果也 变得更生动。...Style Sheets,层叠样式表)可以指定如何展现 HTML 内的各种元素,属于样式表标准之一 所谓动态 HTML(Dynamic HTML),是指使用客户端脚本语言将静态的 HTML 内容变成动态的技术的总...DOM 是用以操作 HTML 文档和 XML 文档的 API( Web 应用 Web 应用是指通过 Web 功能提供的应用程序 CGI(Common Gateway Interface,通用网关接口)是指...Web 服务器在接收到客户端发送过来的请求后转发 给程序的一组机制 随着 CGI 的普及,每次请求都要启动新 CGI 程序的 CGI 运行机制逐渐变成了性能瓶颈,所以之后 Servlet 和 mod_perl...等可直接在 Web 服务器上运行的程序才得以开发、普及 数据发布的格式及语言 XML(eXtensible Markup Language,可扩展标记语言)是一种可按应用目标进行扩展的通用标记语言 RSS
作者:Leonardo Giordani 翻译:老齐 与本文相关书籍推荐:《跟老齐学Python:Django实战》 ---- 4 Web server 4.1 基本原理 我们给Web server的一般标签是...:用于执行任务的软件,nginx和Apache是两个常用的web server,这两个开源项目目前在市场上处于领先地位,它们使用不同的技术方法,都实现了我们在上一节中讨论的所有特性(以及更多特性)。...localhost to: 192.168.240.2:8000: GET / HTTP/1.1 200 这表明nginx正在执行负载平衡,但说实话,这是通过Docker的DNS进行的,而不是通过web...我们在多线程Web框架前面加了一个用于生产的Web服务器,我们可以专注于编写Python代码,而不是处理HTTP头信息。 使用Web服务器允许我们扩展基础设施,只需在其后面添加新实例,而不会中断服务。...(完毕) 原文链接:https://www.thedigitalcatonline.com/blog/2020/02/16/dissecting-a-web-stack/
Web浏览器是一种能够发送HTTP请求并解释响应内容的软件,只要这些内容是HTML文件(以及许多其他文件类型,如图像或视频)。因此,浏览器可以呈现返回信息的内容。...Request format[2] HTTP/1.1 Response format[3] 本文例子的源代码可以在这里找到:https://github.com/lgiordani/dissecting-a-web-stack-code...我还认为,有趣的是,像HTTP这样的技术,现在基本上遍布全世界了,但它们的核心非常简单。 在上面的操作中,HTTP的许多特性都没有在简单socket 编程中涉及到。...很高兴看到这些技术的工作原理,但是在日常工作中,我们需要关注更高层次的东西。 由于HTTP是无状态协议,小型HTTP服务器的情况可能会恶化。...阅读链接 剖析Web技术栈(一) 参考资料 [1] Python 3 Socket Programming HOWTO: https://docs.python.org/3/howto/sockets.html
作为前端工程师不仅要掌握现有的技术去实现业务需求,更要不断的学习新的技术、新的理念,时刻准备着新技术浪潮的来临。 《现代前端技术解析》提及了作为一个前端工程师需要了解的大部分技能。...Web前端技术基础 前端开发模式先后经历了静态黄页时期、服务器组装动态网页数据时期、后端为主的MVC(Model-View-Controller)模式时期、前后端分离方案开发时期、纯前端MV*(...现代Web前端技术发展概述 随着越来越多的业务搬到前端实现、前端的代码量越来越多。...Web前端技术一直以效率和质量为最终导向的道路上探索前进!...、Web SQL、Cookie、CacheStorage、Application Cache,以及不常用的Flash缓存。
领取专属 10元无门槛券
手把手带您无忧上云