怎么隐藏页面的查看源代码功能，急！！！

xiyangyang · 2018-01-09T02:47:28Z

一个做设计的学生来问，怎么把网页的源代码给隐藏起来。她的网页上有很多自制的 css,js 代码，以及一些艺术作品，不想别人轻易的拷贝或者下载了。大家有什么办法吗？

代码

隐藏

网页

CSS

171 replies • 2022-02-27 02:54:15 +08:00

1 2

❮

❯

baicai0817

Jan 9, 2018

1

你自己开发一套系统。

msg7086

Jan 9, 2018

42

2

利用服务器渲染功能，把整个网页转换成图片，然后发给用户，这样他们就看不到源代码了。

xooass

Jan 9, 2018

2

3

做不到，能打开你的页面，就一定能下载页面上的所有资源。

所有什么加 JS 屏蔽右键，加嵌套等等的对于有经验的人来说都是掩耳盗铃

zakokun

Jan 9, 2018

4

简单来说就是禁止右键，这样可以防住很多小白了。

真正想彻底禁止几乎不可能

1609629379

Jan 9, 2018 via Android

5

这个很容易，我之前看到过一个网页为了防盗源代码，只要点击鼠标右键，网页立马就会变成一行字，说什么不能右键。

xwhxbg

Jan 9, 2018

4

6

建议 js 用 jsfuck 编译一下，基本上就是[]()+这种造型了，或者用 web assembly，出来是 assembly language 没有 source map 想反编译比较难，不要写 css 了，用 js+canvas 自己实现样式，同样的 js 过一下 jsfuck，或者用 rust 写 assembly。

meszyouh

Jan 9, 2018

7

直接给出一张图片

f2f2f

Jan 9, 2018

1

8

@1609629379 你这个要破解更容易，一个 js 的事

x86

Jan 9, 2018

9

@1609629379 view-source:URL

ORZRRR

Jan 9, 2018

13

10

我笑出了声，你们呢？

kidult

Jan 9, 2018

1

11

直播打开网页给客户看

whypool

Jan 9, 2018

12

服务端渲染成图片；
没其他办法

initdrv

Jan 9, 2018

13

@x86 #9 我也喜欢用这种方式……

xiaodongus

Jan 9, 2018

14

自己做个浏览器，不带查看源码功能。让网站只能通过自己做的浏览器打开。其他浏览器全部屏蔽，完美！

zpf124

Jan 9, 2018

4

15

最初级：禁用右键，初级菜鸟就能见到防一下。

高级：uglify，把 css 和 js 都混淆了(其实就对 js 意义大点)，让人看着和修改费劲。

宁死不从：用 flash 渲染数据或者后台渲染数据前台就收<img src="内容.jpg">, 再或者 assembly (这个要求浏览器版本得比较新)

cnwtex

Jan 9, 2018

16

http://mojibian.cn/test/

@f2f2f 查看源文件

learnshare

Jan 9, 2018

17

没必要，核心功能和数据在服务端做好防护就行了

bzw875

Jan 9, 2018

18

彻底隐藏做不了，可以混淆压缩 css 和 javascript 啊，增加一点难度

dtysky

Jan 9, 2018

19

@xwhxbg 这两个都是可以逆向的，只是相对安全点罢了

xwhxbg

Jan 9, 2018

20

@dtysky 没有 source map 逆向比较麻烦，前端嘛，做到这样也能防 90%的人了

moxiaonai

Jan 9, 2018

21

gulp 压缩一下

moxiaonai

Jan 9, 2018

22

还可以屏蔽页面右键，屏蔽 f12，可以让大部分人看不到，但是解决不了根本问题

tabris17

Jan 9, 2018

23

webassembly

pkaq

Jan 9, 2018

10

24

有时候你以为重要的东西其实并没有那么重要
这原本就不是一个技术问题
作为老师何不去解开此生心结；）

mokeyjay

Jan 9, 2018

1

25

只能是服务端渲染为图片，不然抓包 GG

dangyuluo

Jan 9, 2018

26

Https，再加个壳？

imn1

Jan 9, 2018

27

防不防 wget 呢？

taojing10

Jan 9, 2018 via Android

28

教你……拍成视频，然后放上去就行了…或者十年前大家 flash 写过网页，你可以复古一下

misaka19000

Jan 9, 2018 via Android

29

@xiaodongus 没用的抓个包就能看到了

carlclone

Jan 9, 2018

30

@ORZRRR 我笑了但是没有出声,因为在上班

rocksolid

Jan 9, 2018

1

31

说句实话,设计重要的是创意,别人都能看到了,就算没代码,写一个很困难么?

alex321

Jan 9, 2018

32

你的东西很重要么。。。这年头天外有天人外有人。花大力气做的东西，可能自己认为很重要；在别人眼里，很可能都不入眼。
老师应该更清楚这种问题吧。

Mutoo

Jan 9, 2018

3

33

正确的方法难道不是加水印加版权申明吗

image72

Jan 9, 2018

34

如果熟悉 react 相关开发，可以直接使用 react-native 相关技术。
mobile app 就直接 react-native,
PC 使用 react-native-macos，react-native-windows
轻松加愉快

bumz

Jan 9, 2018 via iPhone

35

那就把网页替换成截图呗

skyfore

Jan 9, 2018

36

@xiaodongus electron ?

f2f2f

Jan 9, 2018

37

@cnwtex
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
<title>测试页面</title>
</head>
<body>
<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script>
Function("‍‌‌‍‍‍‍‌‍‌‌‍‌‌‍‍‍‌‌‍‍‌‍‌‍‌‌‌‍‍‌‍‍‌‌‌‍‌‍‍‍‍‌‍‌‍‍‍‍‍‌‍‍‍‌‍‍‌‍‌‌‌‍‍‍‌‌‌‍‌‍‌‍‍‌‌‍‌‌‍‍‍‌‌‍‍‌‍‍‍‌‌‍‍‍‌‍‍‌‌‍‍‍‌‍‌‍‌‌‌‍‍‍‌‌‌‍‌‍‌‍‍‌‌‍‌‌‍‍‍‌‌‍‌‌‍‍‍‌‌‍‍‌‍‍‌‌‍‍‌‌‍‍‌‍‌‌‌‍‍‍‌‌‌‍‌‍‌‍‍‌‌‍‌‍‍‍‌‌‍‍‌‌‍‍‍‌‌‍‌‌‍‍‍‌‌‍‍‍‍‍‌‍‌‌‌‍‍‍‌‌‌‍‌‍‌‍‍‌‌‍‌‌‌‍‍‌‌‍‍‌‍‍‍‌‌‍‍‌‌‍‍‌‌‌‍‍‍‍‌‍‌‌‌‍‍‍‌‌‌‍‌‍‌‍‍‌‌‍‌‌‌‍‍‌‌‍‍‌‍‍‍‌‌‍‍‌‌‍‍‌‌‌‍‍‍‍‍‌‍‍‍‌‍‍‍‌‍‌‍‍‌‍‍‌‌‌‍‌‌".replace(/.{8}/g,function(u){return String.fromCharCode(parseInt(u.replace(/\u200c/g,1).replace(/\u200d/g,0),2))}))();
</script>
</body>
</html>

yulitian888

Jan 9, 2018

38

楼主想多了，这个防不住的
稍微有点经验的前端开发人员看几眼，就能仿制出来一个大体差不多的东西，保护原始代码的价值何在？

jisibencom

Jan 9, 2018

39

@f2f2f 这个看起来很高级的样子，怎么解？

Tink

Jan 9, 2018 via iPhone

40

服务器渲染

JohnChiu

Jan 9, 2018

41

@1609629379 禁用 js 不久破解了嘛，前端根本防不住的。。。毕竟是由浏览器解释的超文本标记语言

vjnjc

Jan 9, 2018

42

二楼方法不错，服务器调用 chrome api 生成网页截图发给客户端~

gongcheng121

Jan 9, 2018

43

只要能看到，就能复制

SakuraKuma

Jan 9, 2018

44

大家只能让你死心.

bzzhou

Jan 9, 2018

45

楼主想多了

hjdtl

Jan 9, 2018

46

用 electron 吧

xd314697475

Jan 9, 2018

1

47

普通级
1.禁用右键

专业级
2.css ，js 代码压缩混淆

专家级
3.直接截图展示或者远程桌面

shiny

PRO

Jan 9, 2018

1

48

不如给学生普及下知识产权保护相关的措施和办法。这不是一个技术问题。

uuair

Jan 9, 2018

49

还有一个办法，这是我在 v2 上听说的，就是在写代码的时候，要写很多无意义的代码，函数名称也要用那些无意义的，看起来很正规，很有用的名字，能用 100 行写就不用 1 行，这样基本上看得懂的人，因为看不懂源码的意思，而放弃。。

jason19659

Jan 9, 2018

50

很简单啊，不要用自己的 css，不要放自己的作品别人就下载不到了

shiroming

Jan 9, 2018 via Android

51

大家都那么忙，哪有闲工夫看你的代码

fulvaz

Jan 9, 2018

52

放弃吧.. 就算用图片或者视频, 菜鸡如我都能花一周抄了

trn4

Jan 9, 2018 via iPhone

1

53

laoyur

Jan 9, 2018

54

@1609629379 #5
> 这个很容易，我之前看到过一个网页为了防盗源代码，只要点击鼠标右键，网页立马就会变成一行字，说什么不能右键。

@zpf124 #15
> 最初级：禁用右键

@xd314697475 #47
> 普通级
> 1.禁用右键

----------
噗，心疼 1609629379 一秒

Light3

Jan 9, 2018

55

我觉得只有贴图片可以..
禁止右键防小白而已..
你写乱七八糟的命名也只是减缓看代码的时间没啥实质性的用处..

还有代码这种东西真的有保护的必要吗..
就如 24 楼所说的..

lulinux

Jan 9, 2018

56

首先我想说的是支持楼主的做法。真要防止侵权的话，建议找专业的公司，利用大数据，一逮一个准。到时候抄袭侵权者就像老鼠怕了猫一样乖溜溜的。

panda1001

Jan 9, 2018 via Android

1

57

做设计应该是的瞄上一眼就能复现，根本没必要在乎代码的实现方式

参考知乎
[做出这类 UI 插画需要掌握多少知识 /技能？]
https://www.zhihu.com/question/263980848/answer/288745639

pabupa

Jan 9, 2018

58

@msg7086 厉害了~

overflowHidden

Jan 9, 2018

59

全用图片只适用于纯展示吧，万一有个 css3 动画咋办。js 混淆倒是行，css 防了也没用，有经验的都能仿出来。禁用右键也是白瞎，火狐上有一键下载网页源代码的工具。。。浏览器向来是防君子不防小人，不要想得太强大了

rootsir

Jan 9, 2018

60

@xiaodongus 不顶用，可以抓包，直接看内容

liuminghao233

Jan 9, 2018 via iPhone

61

自己做 app
写个协议用 socket 传顺便加密一下

楼上那些说用 https 什么禁止右键的
这种方法只对他们自己有效

thrall

Jan 9, 2018

4

62

那么多开源的 design 不用，去看一个学生的设计？
自以为有价值罢了

A3m0n

Jan 9, 2018

63

我巴不得别人来看我的代码。

silencefent

Jan 9, 2018

64

想太多，不做 seo，robot.txt 禁止抓取，没人看得到你的网站
实在不行，展示在 tor 网络，记不住地址+不被收录
意义何在

hxsf

Jan 9, 2018

65

@cnwtex #16 最后一个() 改成 .toString() 试试

Funian

Jan 9, 2018

66

防不胜防

UnPace

Jan 9, 2018

67

屏蔽 F12

hxsf

Jan 9, 2018

68

说转图片的，请问 js 交互呢？不要交互，直接截图不就完了，还毛个服务器渲染。。。
说禁用右键的。。。。。。不说啥了
说用别的东西重新写的，考虑过成本么。。。

建议：
1. 开导下他，没有保证无法被逆向的技术。
2. 创意是最有价值的，也是最没有价值的。

> 她的网页上有很多自制的 css,js 代码
加 License，做点加密和混淆工作，增加点逆向难度。（永远无法保证被逆向）

> 以及一些艺术作品
加水印，加 License。