服务器端与 HTTP 头部控制 (最有效、最根本的方法)
这种方法的核心思想是从源头上控制浏览器应该如何处理页面内容,而不是在内容加载后去“对抗”用户,它通过发送特定的 HTTP 响应头来告诉浏览器限制某些行为。

禁用右键菜单 (Context Menu)
这是最直接的非 JS 方法,服务器可以在响应中添加一个 HTTP 头,告诉浏览器不要显示上下文菜单。
HTTP 头:
X-Content-Options: nosniff
这个头主要是为了防止 MIME 类型混淆攻击,但它在某些浏览器(如旧版 IE)中也有禁用右键菜单的效果,更现代和通用的方法是使用 meta 标签(见下文),因为它在 HTML 层面工作,兼容性更好。
禁用框架嵌套 (Frame Busting)
为了防止你的网页被嵌入到 iframe 中(被恶意网站用来伪装),服务器可以发送一个 X-Frame-Options 头。

HTTP 头:
X-Frame-Options: DENY 或 X-Frame-Options: SAMEORIGIN
DENY: 禁止在任何页面的iframe中显示。SAMEORIGIN: 只允许在同源页面的iframe中显示。
这并不能直接阻止用户查看源代码,但它可以防止一种常见的“点击劫持”攻击,攻击者正是通过 iframe 来诱导用户点击他们不想点击的东西。
强制下载而非显示 (对于代码文件)
如果你的“代码”是指服务器上的某个文件(code.txt),你可以通过服务器配置让浏览器直接下载它,而不是在浏览器中显示其内容。
Nginx 配置示例:

location /code.txt {
default_type application/octet-stream;
add_header Content-Disposition "attachment; filename=code.txt";
}
Apache 配置示例 (.htaccess):
<Files "code.txt">
ForceType application/octet-stream
Header set Content-Disposition "attachment; filename=code.txt"
</Files>
这样,当用户访问 code.txt 时,浏览器会弹出一个下载对话框,而不是在页面上显示代码。
HTML 元素与标签属性 (简单但有限)
这些方法不依赖 JS,而是直接使用 HTML 的原生特性。
禁用右键菜单 (通过 <meta>
在 HTML 的 <head> 部分加入 <meta> 标签,可以在某些浏览器(特别是基于 IE/Edge 内核的浏览器)中禁用右键菜单。
HTML 代码:
<meta http-equiv="imagetoolbar" content="no" />
<!-- 这个标签主要是为了禁用图片工具栏,但在某些旧版浏览器中会影响右键行为 -->
重要提示: 这种方法的兼容性非常差,在现代的 Chrome, Firefox, Safari 等主流浏览器中,这个 meta 标签已经完全无效,它不是一个可靠的解决方案。
使用 <plaintext> 或 <xmp> 标签 (过时的方法)
HTML 中有两个非常古老的标签,它们会将其中的所有内容都作为纯文本显示,并且浏览器会自动转义 HTML 标签。
HTML 代码:
<plaintext>
<h1>这不会被渲染成标题</h1>
<script>alert('这也不会执行');</script>
// 你的代码写在这里,会原样显示
</plaintext>
缺点:
- 已废弃: 这两个标签早已被 HTML 规范废弃,不推荐使用。
- 功能单一: 它只做一件事——显示纯文本,无法实现复杂的交互控制。
- 样式丢失: 无法对代码进行任何高亮或样式美化。
浏览器安全策略与网络环境 (外部强制手段)
这些方法不修改网页本身,而是通过改变用户访问网页的环境来达到目的。
使用 Content Security Policy (CSP)
CSP 是一个强大的安全标准,通过 HTTP 头部定义,告诉浏览器页面中可以加载哪些资源(脚本、样式、图片等),以及哪些行为是被允许的。
示例:
Content-Security-Policy: default-src 'self'; script-src 'none';
这个策略的意思是:
default-src 'self': 默认情况下,所有资源(如图片、CSS)只能从同源加载。
script-src 'none': 禁止加载任何 JavaScript 脚本。
效果:
- 无法执行 JS: 页面中所有的
<script> 标签和内联 JS 都将被忽略。
- 间接屏蔽功能: 由于 JS 被完全禁止,那些依赖 JS 来实现屏蔽左右键、禁用右键菜单、防复制等功能的代码自然也就无法运行了,这相当于从根源上“废掉”了所有基于 JS 的保护措施。
- 强大的副作用: CSP 的主要目的是安全,防止 XSS 攻击和恶意脚本注入,但它会严重影响网站的正常功能,除非网站本身就是为无 JS 环境设计的。
部署企业级 Web 代理 / 防火墙
在大型企业或组织中,可以通过部署 Web 代理服务器或防火墙来过滤和重写网页内容。
- 工作原理: 当用户请求一个网页时,请求会先经过代理服务器,代理服务器可以:
- 注入脚本: 自动向返回的 HTML 中注入一段 JavaScript,实现屏蔽功能。
- 移除元素: 直接从 HTML 中删除用户可能用来“作弊”的元素(如
<textarea>)。
- 阻止请求: 阻止用户访问开发者工具的特定接口(虽然非常困难)。
- 特点: 这是一种集中式管理的方法,对用户是透明的,但它需要专业的 IT 人员来维护,通常只适用于组织内部,不适用于公开的网站。
总结与对比
方法
核心原理
优点
缺点
适用场景
HTTP 头部控制
服务器直接与浏览器通信,指令性强
最根本、最有效,不易被绕过
需要服务器配置权限,功能相对单一
保护整个网站、防止点击劫持、控制文件下载
HTML <meta>
利用 HTML 元素的古老属性
无需 JS,代码简单
兼容性极差,在现代浏览器中基本无效
几乎不适用于现代 Web 开发
<plaintext>
强制渲染为纯文本
简单,能原样显示代码
已废弃,功能单一,无法美化
仅用于在非常古老的浏览器中显示代码片段
CSP (内容安全策略)
定义严格的资源加载和安全策略
极其强大,从根源上杜绝 JS 和 XSS
配置复杂,严重影响网站正常功能,需要网站本身适配
高安全性要求的网站,防止恶意脚本攻击
Web 代理/防火墙
网络层面的内容过滤和重写
集中式管理,对用户透明
需要专业设备和维护,不灵活
企业内部网络,统一上网行为管理
如果你想在不使用 JavaScript 的情况下实现屏蔽功能,最可靠的方法是使用服务器端的 HTTP 头部,特别是 X-Frame-Options 和 Content-Security-Policy。
- 如果你想防止代码被轻易复制或查看,最佳方案是不将代码作为前端资源,而是通过服务器配置使其强制下载。
- 如果你想禁用右键菜单,在现代 Web 环境下,几乎无法找到可靠的非 JS 方法,唯一可行的方案是配置 CSP 禁止所有 JS,但这会“杀死”整个网站的交互性。
任何纯前端(HTML/CSS)的“屏蔽”措施都是脆弱且不可靠的,因为用户总有办法绕过(禁用 JS 的浏览器插件、使用开发者工具的 Overrides 功能),真正的保护必须依赖于服务端的策略和配置。
在 HTML 的 <head> 部分加入 <meta> 标签,可以在某些浏览器(特别是基于 IE/Edge 内核的浏览器)中禁用右键菜单。
HTML 代码:
<meta http-equiv="imagetoolbar" content="no" /> <!-- 这个标签主要是为了禁用图片工具栏,但在某些旧版浏览器中会影响右键行为 -->
重要提示: 这种方法的兼容性非常差,在现代的 Chrome, Firefox, Safari 等主流浏览器中,这个 meta 标签已经完全无效,它不是一个可靠的解决方案。
使用 <plaintext> 或 <xmp> 标签 (过时的方法)
HTML 中有两个非常古老的标签,它们会将其中的所有内容都作为纯文本显示,并且浏览器会自动转义 HTML 标签。
HTML 代码:
<plaintext>
<h1>这不会被渲染成标题</h1>
<script>alert('这也不会执行');</script>
// 你的代码写在这里,会原样显示
</plaintext>
缺点:
- 已废弃: 这两个标签早已被 HTML 规范废弃,不推荐使用。
- 功能单一: 它只做一件事——显示纯文本,无法实现复杂的交互控制。
- 样式丢失: 无法对代码进行任何高亮或样式美化。
浏览器安全策略与网络环境 (外部强制手段)
这些方法不修改网页本身,而是通过改变用户访问网页的环境来达到目的。
使用 Content Security Policy (CSP)
CSP 是一个强大的安全标准,通过 HTTP 头部定义,告诉浏览器页面中可以加载哪些资源(脚本、样式、图片等),以及哪些行为是被允许的。
示例:
Content-Security-Policy: default-src 'self'; script-src 'none';
这个策略的意思是:
default-src 'self': 默认情况下,所有资源(如图片、CSS)只能从同源加载。script-src 'none': 禁止加载任何 JavaScript 脚本。
效果:
- 无法执行 JS: 页面中所有的
<script>标签和内联 JS 都将被忽略。 - 间接屏蔽功能: 由于 JS 被完全禁止,那些依赖 JS 来实现屏蔽左右键、禁用右键菜单、防复制等功能的代码自然也就无法运行了,这相当于从根源上“废掉”了所有基于 JS 的保护措施。
- 强大的副作用: CSP 的主要目的是安全,防止 XSS 攻击和恶意脚本注入,但它会严重影响网站的正常功能,除非网站本身就是为无 JS 环境设计的。
部署企业级 Web 代理 / 防火墙
在大型企业或组织中,可以通过部署 Web 代理服务器或防火墙来过滤和重写网页内容。
- 工作原理: 当用户请求一个网页时,请求会先经过代理服务器,代理服务器可以:
- 注入脚本: 自动向返回的 HTML 中注入一段 JavaScript,实现屏蔽功能。
- 移除元素: 直接从 HTML 中删除用户可能用来“作弊”的元素(如
<textarea>)。 - 阻止请求: 阻止用户访问开发者工具的特定接口(虽然非常困难)。
- 特点: 这是一种集中式管理的方法,对用户是透明的,但它需要专业的 IT 人员来维护,通常只适用于组织内部,不适用于公开的网站。
总结与对比
| 方法 | 核心原理 | 优点 | 缺点 | 适用场景 |
|---|---|---|---|---|
| HTTP 头部控制 | 服务器直接与浏览器通信,指令性强 | 最根本、最有效,不易被绕过 | 需要服务器配置权限,功能相对单一 | 保护整个网站、防止点击劫持、控制文件下载 |
HTML <meta> |
利用 HTML 元素的古老属性 | 无需 JS,代码简单 | 兼容性极差,在现代浏览器中基本无效 | 几乎不适用于现代 Web 开发 |
<plaintext> |
强制渲染为纯文本 | 简单,能原样显示代码 | 已废弃,功能单一,无法美化 | 仅用于在非常古老的浏览器中显示代码片段 |
| CSP (内容安全策略) | 定义严格的资源加载和安全策略 | 极其强大,从根源上杜绝 JS 和 XSS | 配置复杂,严重影响网站正常功能,需要网站本身适配 | 高安全性要求的网站,防止恶意脚本攻击 |
| Web 代理/防火墙 | 网络层面的内容过滤和重写 | 集中式管理,对用户透明 | 需要专业设备和维护,不灵活 | 企业内部网络,统一上网行为管理 |
如果你想在不使用 JavaScript 的情况下实现屏蔽功能,最可靠的方法是使用服务器端的 HTTP 头部,特别是 X-Frame-Options 和 Content-Security-Policy。
- 如果你想防止代码被轻易复制或查看,最佳方案是不将代码作为前端资源,而是通过服务器配置使其强制下载。
- 如果你想禁用右键菜单,在现代 Web 环境下,几乎无法找到可靠的非 JS 方法,唯一可行的方案是配置 CSP 禁止所有 JS,但这会“杀死”整个网站的交互性。
任何纯前端(HTML/CSS)的“屏蔽”措施都是脆弱且不可靠的,因为用户总有办法绕过(禁用 JS 的浏览器插件、使用开发者工具的 Overrides 功能),真正的保护必须依赖于服务端的策略和配置。
