V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
xiyangyang
V2EX  ›  程序员

怎么隐藏页面的查看源代码功能,急!!!

  •  
  •   xiyangyang · 2018-01-09 10:47:28 +08:00 · 30497 次点击
    这是一个创建于 1479 天前的主题,其中的信息可能已经有所发展或是发生改变。

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

    大家有什么办法吗?

    170 条回复    2018-01-11 14:29:27 +08:00
    1  2  
    baicai0817
        1
    baicai0817  
       2018-01-09 10:55:17 +08:00
    你自己开发一套系统。
    msg7086
        2
    msg7086  
       2018-01-09 10:55:41 +08:00   ❤️ 42
    利用服务器渲染功能,把整个网页转换成图片,然后发给用户,这样他们就看不到源代码了。
    xooass
        3
    xooass  
       2018-01-09 10:57:30 +08:00   ❤️ 2
    做不到,能打开你的页面,就一定能下载页面上的所有资源。

    所有什么加 JS 屏蔽右键,加嵌套等等的对于有经验的人来说都是掩耳盗铃
    zakokun
        4
    zakokun  
       2018-01-09 10:58:16 +08:00
    简单来说就是禁止右键,这样可以防住很多小白了。

    真正想彻底禁止几乎不可能
    1609629379
        5
    1609629379  
       2018-01-09 10:59:31 +08:00 via Android
    这个很容易,我之前看到过一个网页为了防盗源代码,只要点击鼠标右键,网页立马就会变成一行字,说什么不能右键。
    xwhxbg
        6
    xwhxbg  
       2018-01-09 11:01:20 +08:00   ❤️ 4
    建议 js 用 jsfuck 编译一下,基本上就是[]()+这种造型了,或者用 web assembly,出来是 assembly language 没有 source map 想反编译比较难,不要写 css 了,用 js+canvas 自己实现样式,同样的 js 过一下 jsfuck,或者用 rust 写 assembly。
    meszyouh
        7
    meszyouh  
       2018-01-09 11:01:34 +08:00
    直接给出一张图片
    f2f2f
        8
    f2f2f  
       2018-01-09 11:03:22 +08:00   ❤️ 1
    @1609629379 你这个要破解更容易,一个 js 的事
    x86
        9
    x86  
       2018-01-09 11:04:41 +08:00
    @1609629379 view-source:URL
    ORZRRR
        10
    ORZRRR  
       2018-01-09 11:05:26 +08:00   ❤️ 13
    我笑出了声,你们呢?
    kidult
        11
    kidult  
       2018-01-09 11:06:21 +08:00   ❤️ 1
    直播打开网页给客户看
    whypool
        12
    whypool  
       2018-01-09 11:06:43 +08:00
    服务端渲染成图片;
    没其他办法
    initdrv
        13
    initdrv  
       2018-01-09 11:08:08 +08:00
    @x86 #9 我也喜欢用这种方式……
    xiaodongus
        14
    xiaodongus  
       2018-01-09 11:10:59 +08:00
    自己做个浏览器,不带查看源码功能。让网站只能通过自己做的浏览器打开。其他浏览器全部屏蔽,完美!
    zpf124
        15
    zpf124  
       2018-01-09 11:11:57 +08:00   ❤️ 4
    最初级:禁用右键,初级菜鸟就能见到防一下。

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

    宁死不从: 用 flash 渲染数据 或者 后台渲染数据前台就收<img src="内容.jpg">, 再或者 assembly (这个要求浏览器版本得比较新)
    cnwtex
        16
    cnwtex  
       2018-01-09 11:13:25 +08:00
    learnshare
        17
    learnshare  
       2018-01-09 11:15:11 +08:00
    没必要,核心功能和数据在服务端做好防护就行了
    bzw875
        18
    bzw875  
       2018-01-09 11:18:15 +08:00
    彻底隐藏做不了,可以混淆压缩 css 和 javascript 啊,增加一点难度
    dtysky
        19
    dtysky  
       2018-01-09 11:18:45 +08:00
    @xwhxbg 这两个都是可以逆向的,只是相对安全点罢了
    xwhxbg
        20
    xwhxbg  
       2018-01-09 11:25:59 +08:00
    @dtysky 没有 source map 逆向比较麻烦,前端嘛,做到这样也能防 90%的人了
    moxiaonai
        21
    moxiaonai  
       2018-01-09 11:33:26 +08:00
    gulp 压缩一下
    moxiaonai
        22
    moxiaonai  
       2018-01-09 11:34:54 +08:00
    还可以屏蔽页面右键,屏蔽 f12,可以让大部分人看不到,但是解决不了根本问题
    tabris17
        23
    tabris17  
       2018-01-09 11:44:22 +08:00
    webassembly
    pkaq
        24
    pkaq  
       2018-01-09 11:44:51 +08:00   ❤️ 10
    有时候你以为重要的东西 其实并没有那么重要
    这原本就不是一个技术问题
    作为老师何不去解开此生心结;)
    mokeyjay
        25
    mokeyjay  
       2018-01-09 11:46:08 +08:00   ❤️ 1
    只能是服务端渲染为图片,不然抓包 GG
    dangyuluo
        26
    dangyuluo  
       2018-01-09 11:46:40 +08:00
    Https,再加个壳?
    imn1
        27
    imn1  
       2018-01-09 11:48:42 +08:00
    防不防 wget 呢?
    taojing10
        28
    taojing10  
       2018-01-09 11:50:13 +08:00 via Android
    教你……拍成视频,然后放上去就行了…或者十年前大家 flash 写过网页,你可以复古一下
    misaka19000
        29
    misaka19000  
       2018-01-09 11:52:28 +08:00 via Android
    @xiaodongus 没用的 抓个包就能看到了
    carlclone
        30
    carlclone  
       2018-01-09 11:56:55 +08:00
    @ORZRRR 我笑了但是没有出声,因为在上班
    rocksolid
        31
    rocksolid  
       2018-01-09 11:59:37 +08:00   ❤️ 1
    说句实话,设计重要的是创意,别人都能看到了,就算没代码,写一个很困难么?
    alex321
        32
    alex321  
       2018-01-09 12:01:08 +08:00
    你的东西很重要么。。。这年头天外有天人外有人。花大力气做的东西,可能自己认为很重要;在别人眼里,很可能都不入眼。
    老师应该更清楚这种问题吧。
    Mutoo
        33
    Mutoo  
       2018-01-09 12:06:02 +08:00   ❤️ 3
    正确的方法难道不是加水印加版权申明吗
    image72
        34
    image72  
       2018-01-09 12:07:11 +08:00
    如果熟悉 react 相关开发, 可以直接使用 react-native 相关技术。
    mobile app 就直接 react-native,
    PC 使用 react-native-macos,react-native-windows
    轻松加愉快
    bumz
        35
    bumz  
       2018-01-09 12:08:13 +08:00 via iPhone
    那就把网页替换成截图呗
    skyfore
        36
    skyfore  
       2018-01-09 12:12:55 +08:00
    @xiaodongus electron ?
    f2f2f
        37
    f2f2f  
       2018-01-09 12:16:54 +08:00
    @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
        38
    yulitian888  
       2018-01-09 12:21:31 +08:00
    楼主想多了,这个防不住的
    稍微有点经验的前端开发人员看几眼,就能仿制出来一个大体差不多的东西,保护原始代码的价值何在?
    jisibencom
        39
    jisibencom  
       2018-01-09 12:24:15 +08:00
    @f2f2f 这个看起来很高级的样子,怎么解?
    Tink
        40
    Tink  
       2018-01-09 12:29:10 +08:00 via iPhone
    服务器渲染
    JohnChiu
        41
    JohnChiu  
       2018-01-09 12:33:56 +08:00
    @1609629379 禁用 js 不久破解了嘛,前端根本防不住的。。。毕竟是由浏览器解释的超文本标记语言
    vjnjc
        42
    vjnjc  
       2018-01-09 12:34:00 +08:00
    二楼方法不错,服务器调用 chrome api 生成网页截图发给客户端~
    gongcheng121
        43
    gongcheng121  
       2018-01-09 12:34:12 +08:00
    只要能看到,就能复制
    SakuraKuma
        44
    SakuraKuma  
       2018-01-09 12:53:20 +08:00
    大家只能让你死心.
    bzzhou
        45
    bzzhou  
       2018-01-09 13:03:19 +08:00
    楼主想多了
    hjdtl
        46
    hjdtl  
       2018-01-09 13:05:57 +08:00
    用 electron 吧
    xd314697475
        47
    xd314697475  
       2018-01-09 13:06:58 +08:00   ❤️ 1
    普通级
    1.禁用右键

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

    专家级
    3.直接截图展示或者远程桌面
    shiny
        48
    shiny  
       2018-01-09 13:11:08 +08:00   ❤️ 1
    不如给学生普及下知识产权保护相关的措施和办法。这不是一个技术问题。
    uuair
        49
    uuair  
       2018-01-09 13:11:38 +08:00
    还有一个办法,这是我在 v2 上听说的,就是在写代码的时候,要写很多无意义的代码,函数名称也要用那些无意义的,看起来很正规,很有用的名字,能用 100 行写就不用 1 行,这样基本上看得懂的人,因为看不懂源码的意思,而放弃。。
    jason19659
        50
    jason19659  
       2018-01-09 13:12:22 +08:00
    很简单啊,不要用自己的 css,不要放自己的作品别人就下载不到了
    shiroming
        51
    shiroming  
       2018-01-09 13:13:31 +08:00 via Android
    大家都那么忙,哪有闲工夫看你的代码
    fulvaz
        52
    fulvaz  
       2018-01-09 13:14:34 +08:00
    放弃吧.. 就算用图片或者视频, 菜鸡如我都能花一周抄了
    xiadong1994
        53
    xiadong1994  
       2018-01-09 13:15:45 +08:00 via iPhone   ❤️ 1
    正解应该是版权声明+法律手段。话说知道看源代码的会不知道怎么绕过右键屏蔽。
    laoyur
        54
    laoyur  
       2018-01-09 13:17:29 +08:00
    @1609629379 #5
    > 这个很容易,我之前看到过一个网页为了防盗源代码,只要点击鼠标右键,网页立马就会变成一行字,说什么不能右键。

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


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

    ----------
    噗,心疼 1609629379 一秒
    Light3
        55
    Light3  
       2018-01-09 13:18:29 +08:00
    我觉得只有贴图片可以..
    禁止右键 防小白而已..
    你写乱七八糟的命名 也只是减缓看代码的时间 没啥实质性的用处..

    还有代码这种东西 真的有保护的必要吗..
    就如 24 楼所说的..
    lulinux
        56
    lulinux  
       2018-01-09 13:21:36 +08:00
    首先我想说的是支持楼主的做法。真要防止侵权的话,建议找专业的公司,利用大数据,一逮一个准。到时候抄袭侵权者就像老鼠怕了猫一样乖溜溜的。
    panda1001
        57
    panda1001  
       2018-01-09 13:33:55 +08:00 via Android   ❤️ 1
    做设计应该是的瞄上一眼就能复现,根本没必要在乎代码的实现方式

    参考知乎
    [做出这类 UI 插画需要掌握多少知识 /技能?]
    https://www.zhihu.com/question/263980848/answer/288745639
    pabupa
        58
    pabupa  
       2018-01-09 13:36:49 +08:00
    @msg7086 厉害了~
    overflowHidden
        59
    overflowHidden  
       2018-01-09 13:38:08 +08:00
    全用图片只适用于纯展示吧,万一有个 css3 动画咋办。js 混淆倒是行,css 防了也没用,有经验的都能仿出来。禁用右键也是白瞎,火狐上有一键下载网页源代码的工具。。。浏览器向来是防君子不防小人,不要想得太强大了
    rootsir
        60
    rootsir  
       2018-01-09 13:38:55 +08:00
    @xiaodongus 不顶用,可以抓包,直接看内容
    liuminghao233
        61
    liuminghao233  
       2018-01-09 13:43:56 +08:00 via iPhone
    自己做 app
    写个协议用 socket 传 顺便加密一下


    楼上那些说用 https 什么禁止右键的
    这种方法只对他们自己有效
    thrall
        62
    thrall  
       2018-01-09 13:44:47 +08:00   ❤️ 4
    那么多开源的 design 不用,去看一个学生的设计?
    自以为有价值罢了
    A3m0n
        63
    A3m0n  
       2018-01-09 13:47:34 +08:00
    我巴不得别人来看我的代码。
    silencefent
        64
    silencefent  
       2018-01-09 13:50:47 +08:00
    想太多,不做 seo,robot.txt 禁止抓取,没人看得到你的网站
    实在不行,展示在 tor 网络,记不住地址+不被收录
    意义何在
    hxsf
        65
    hxsf  
       2018-01-09 13:56:52 +08:00
    @cnwtex #16 最后一个() 改成 .toString() 试试
    Funian
        66
    Funian  
       2018-01-09 13:58:06 +08:00
    防不胜防
    UnPace
        67
    UnPace  
       2018-01-09 14:04:12 +08:00
    屏蔽 F12
    hxsf
        68
    hxsf  
       2018-01-09 14:04:57 +08:00
    说转图片的,请问 js 交互呢 ? 不要交互,直接截图不就完了,还毛个服务器渲染。。。
    说禁用右键的。。。。。。不说啥了
    说用别的东西重新写的,考虑过成本么。。。

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

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

    > 以及一些艺术作品
    加水印, 加 License。
    kimqcn
        69
    kimqcn  
       2018-01-09 14:06:17 +08:00   ❤️ 1
    可以用 flash 显示
    anasplrt34
        70
    anasplrt34  
       2018-01-09 14:06:26 +08:00
    ww 有时候你的东西并没有那么重要 有谁会无聊到去抄一个才毕业的学生的网站的 css 吐槽完毕
    js 混淆呗 没谁会为了个 css 而反编译的 有那功夫干点啥不好
    szdubinbin
        71
    szdubinbin  
       2018-01-09 14:06:32 +08:00
    我们做微信公众号 /小程序开发,见到竞品有啥我们都能弄过来....
    iyour
        72
    iyour  
       2018-01-09 14:08:51 +08:00
    前端现在还有看源码才能仿得出来的东西么?
    msg7086
        73
    msg7086  
       2018-01-09 14:12:15 +08:00
    @hxsf 服务器渲染就是截图的意思,你竟然不知道吗。
    66beta
        74
    66beta  
       2018-01-09 14:17:04 +08:00   ❤️ 2
    那么回到起源,当初为什么要晒出来给别人看?
    likuku
        75
    likuku  
       2018-01-09 14:17:12 +08:00   ❤️ 1
    作品转成视频吧。假若是页面效果,那就录屏,视频且必须付费观看。

    其它办法,要么自己开发一整套闭源展示系统。

    其实即便页面的,一定要保密,可以尝试用游戏引擎开发一个本地运行的 App,
    把自己想法创意来实现,只发布编译的 2 进制版。抄袭没法杜绝(律师团+付费获取)
    fy
        76
    fy  
       2018-01-09 14:29:07 +08:00
    css 和 js 都能混淆,需要的话就配置一下呗
    huclengyue
        77
    huclengyue  
       2018-01-09 14:31:57 +08:00 via Android
    @1609629379 不能右键就不能看代码了??
    hxsf
        78
    hxsf  
       2018-01-09 14:32:10 +08:00 via iPhone
    @msg7086 对于前端来说服务端渲染指的是

    spa,在服务器渲染好 html 便于 seo 和 合成首屏的数据。

    如果单纯截图的话 js 交互就没了。也不需要“服务端”
    tjsdtc
        79
    tjsdtc  
       2018-01-09 14:32:53 +08:00
    https://passport.ly.com/
    之前看到这个页面的实现挺有意思的,一打开开发者工具就进断点了,估计是判断开启开发者工具以后在一个死循环里面 eval 了一段包含 debugger 的代码,虽然感觉本质上并没有什么卵用…只能给人家拷代码带来一些阻碍
    miniwade514
        80
    miniwade514  
       2018-01-09 14:35:19 +08:00
    A. JS uglify
    B. 主动把自己的作品提交到 Dribbble 或 Github
    deepkolos
        81
    deepkolos  
       2018-01-09 14:37:47 +08:00
    远程桌面这招厉害, 见过实验楼用过, 还有腾讯云网页版的远程
    Jackeriss
        82
    Jackeriss  
       2018-01-09 14:48:12 +08:00
    网址都不贴怎么帮你分析问题?
    nosay
        83
    nosay  
       2018-01-09 14:48:53 +08:00
    1.禁右键
    2.禁 F12
    3.网页数据全部 ajax 取

    但是还是只能防小白,碰到稍懂的人全部歇菜
    反正如果怕就别传上网
    如果怕就弄成图片加上版权水印

    完了
    WytheHuang
        84
    WytheHuang  
       2018-01-09 14:49:17 +08:00
    放 U 盘算了, 又要威, 又要戴头盔.
    konakona
        85
    konakona  
       2018-01-09 14:51:56 +08:00
    你可以把 css 和 js 压缩,这样别人拿到后即便能复用,也不能修改。因为变量名和关系已经乱套了,23333
    yanqing07
        86
    yanqing07  
       2018-01-09 14:56:47 +08:00
    jarnanchen
        87
    jarnanchen  
       2018-01-09 15:15:33 +08:00
    小白就算看到你的代码也没用,真正搞前端的,不存在隐藏源代码这一种东西。
    Khlieb
        88
    Khlieb  
       2018-01-09 15:21:05 +08:00 via Android
    bojackhorseman
        89
    bojackhorseman  
       2018-01-09 15:21:30 +08:00
    @tjsdtc #79 然而 chrome 上 ctrl+u 还是能看到源码
    chztv
        90
    chztv  
       2018-01-09 15:22:05 +08:00
    自制的 css 和 js ?如果只是一些函数,要让这个学生相信,肯定 Google 上能找到比他写的更好的 css 和 js,没有隐藏的必要。至于艺术作品,放个缩略图就行,没啥好怕,真正的设计是属于他的,别人偷不走。
    ii4Rookie
        91
    ii4Rookie  
       2018-01-09 15:35:18 +08:00
    @ORZRRR 我只能滑稽的笑 上班不敢笑出声
    我到现在都没看到别人能写出自制的 css/js 我怀疑自己是只菜鸡 哈哈哈哈
    lbp0200
        92
    lbp0200  
       2018-01-09 15:37:19 +08:00
    让她自己留着,不要给任何人看。
    killerv
        93
    killerv  
       2018-01-09 15:38:02 +08:00
    根本防不住
    gclove
        94
    gclove  
       2018-01-09 15:39:57 +08:00
    这肯定防不住的啊,顶 @lbp0200 ,不要放在网上不就行了嘛

    css 再怎么也不能防, 就是的话可以加密一下
    lulinux
        95
    lulinux  
       2018-01-09 15:42:33 +08:00 via Android
    @kimqcn 正想说。flash 闭源,真正的好软件!
    F1024
        96
    F1024  
       2018-01-09 15:42:56 +08:00
    自制的 CSS JS 代码有啥用 还能玩出花来? 图片视频的话 可以加水印
    wizardforcel
        97
    wizardforcel  
       2018-01-09 15:52:48 +08:00
    @lulinux 现有技术完全可以把 swf 逆向为 ActionScript。
    Daath
        98
    Daath  
       2018-01-09 15:56:22 +08:00
    好像上次有個 v 友也是問了這個问题....
    sunnyadam
        99
    sunnyadam  
       2018-01-09 16:04:48 +08:00
    基本无解
    M003
        100
    M003  
       2018-01-09 16:11:52 +08:00
    @xwhxbg 昨晚刚处理了一条,大同小异,你把正常的 js 编译之后 把一串看不懂的字符串的最好一个"()"换成 ".toString() ",然后在控制器中运行一下,你看到一个新世界.
    1  2  
    关于   ·   帮助文档   ·   API   ·   FAQ   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   3938 人在线   最高记录 5497   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 39ms · UTC 03:40 · PVG 11:40 · LAX 19:40 · JFK 22:40
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.