这是一个创建于 408 天前的主题，其中的信息可能已经有所发展或是发生改变。
刚自己手搓了个论坛 http://guang.su ，主要是借鉴了 V2EX 和 discuz 的设计。
自己独特的可以拿出来说一说的主要有以下一些设计：
1. 前后端都极简，没有使用任何框架，特别是前端 css, js 都是纯手搓，这样能保证代码的极简，部署在国外网络不太好的机器上时，能以还不错的速度跑起来
2. 界面设计采用了优雅的毛玻璃风格
3. 密码在前端加密，不明文传输，这样即便不幸被脱裤，用户密码也不会出现在各种社工库里
4. discuz 的 ubb 代码和现在流行的 markdown 同时支持。我自己是喜欢用 ubb 的，因为和 html 比较像
5. 实践了 PWA, 我自己试了下效果还不错，也还有一些问题，后续再慢慢解决
论坛主要方向是游戏，二次元，服务器和域名等，欢迎新老朋友们来玩哦~
自己独特的可以拿出来说一说的主要有以下一些设计：
1. 前后端都极简，没有使用任何框架，特别是前端 css, js 都是纯手搓，这样能保证代码的极简，部署在国外网络不太好的机器上时，能以还不错的速度跑起来
2. 界面设计采用了优雅的毛玻璃风格
3. 密码在前端加密，不明文传输，这样即便不幸被脱裤，用户密码也不会出现在各种社工库里
4. discuz 的 ubb 代码和现在流行的 markdown 同时支持。我自己是喜欢用 ubb 的，因为和 html 比较像
5. 实践了 PWA, 我自己试了下效果还不错，也还有一些问题，后续再慢慢解决
论坛主要方向是游戏，二次元，服务器和域名等，欢迎新老朋友们来玩哦~
第 1 条附言 · 2023-10-22 01:08:19 +08:00
针对评论里说的”背景图太花哨“，我补充下自己的看法吧：
当人精力充沛，注意力足够的时候，这点识别度都是有的，对正常年轻人都不会构成太大的识别障碍
这和你看电影和游戏里的字幕是一样的，有些人说”我玩 3d 游戏就是眩晕“，那属实是无能为力了
当人精力充沛，注意力足够的时候，这点识别度都是有的，对正常年轻人都不会构成太大的识别障碍
这和你看电影和游戏里的字幕是一样的，有些人说”我玩 3d 游戏就是眩晕“，那属实是无能为力了
第 2 条附言 · 2023-10-22 12:38:05 +08:00
谢谢大家的评论了，不管是和善的还是欠缺礼貌的，至少有人回复，有人关注，我觉得都比无人问津要好，哈哈
第 3 条附言 · 2023-10-23 13:32:55 +08:00
多谢一位低调的技术大佬私下提醒了我几处安全漏洞。。。说实话在评论区里瞎起哄的人，真的，我现在觉得越是水平不行的人越张扬，喷的越起劲
第 4 条附言 · 2023-10-24 01:11:45 +08:00
有些朋友很奇怪，为什么技术讨论着讨论着，就变成人身攻击？意思是我不能针对你的说法提出疑问是吗，不接受你的说法就要升级成战斗模式？正常的逻辑难道不是基于我的疑问再回去寻找相关的论据来支撑你的论点吗？
 |
101
wxw752 2023-10-22 14:41:19 +08:00
刚打完游戏，显示器还开着暗部增强，一进去文章标题白的我快瞎了。。。
关掉暗部增强能强一点，但是也就是一点，以我的感受来讲标题还是太白了。 |
 |
102
orlog OP @lisongeee 你的无脑 https 在我看来是根本不懂，或者没有认真思考过这个加密协议当初为什么诞生，另外，我 at 你不是希望你杠回来，只是为了让我发言的上下文对的上号
|
 |
103
rimutuyuan 2023-10-22 14:43:12 +08:00
|
|
104
orlog OP @rimutuyuan 我觉得你始终都没有理解我为什么要前端加密。。。
|
 |
105
Rorysky 2023-10-22 14:48:07 +08:00
有没有法律风险
|
|
106
orlog OP @Rorysky 法律风险是指？图片素材我有些是从网上扒的，可能有版权隐患，不过我这 1 ip 的小个人网站应该问题不大吧
|
|
108
rimutuyuan 2023-10-22 14:55:18 +08:00  2
@orlog
> 密码在前端加密，不明文传输，这样即便不幸被脱裤，用户密码也不会出现在各种社工库里 你的这句话，前端加密的是防止即使被脱裤，密码也不会出现在社工库 那你知不知道在当前的项目实践中，只要是有点经验的开发人员，或者使用稍微成熟一点的 web 框架，都不会明文存储用户密码，这是不怕脱裤的根本，和前端哈希毫无关系 前端哈希是为了防止中间人攻击，拿到密码明文去尝试其他平台登录，而防止中间人攻击更好的方法是使用 https 协议 ------------ 设计方面不做评价，如果你在本科毕业前做出这样的项目，已经比 90%的学生强了 但这个论坛里面大多不是学生，而是有经验的互联网从业人员，大家在鼓励你之外指出了问题，一个人指出问题可能是他个人原因，当有多人指出同样的问题时，你应该考虑是否是自己做的不足 如果你只是想得到赞赏，应该去一个不那么专业的平台去发布你的作品 |
 |
109
auh 2023-10-22 14:56:21 +08:00
开源吧，没啥好说的。
|
|
110
orlog OP @rimutuyuan 先不说这个前端加密的事。。。我觉得你的发言始终都有种很先入为主的优越感，不知道你自己感觉到没有
|
|
111
rimutuyuan 2023-10-22 14:58:45 +08:00
|
|
112
orlog OP @rimutuyuan 比如你在发言的同时就预设了很多前提，比如我是没毕业的大学生，比如你的观点是对的。网上有句很流行的话不知你听过没有，叫 “先问是不是，再问为什么”，虽然你没问我为什么，但你把“你是对的”这点，在还没论证过的情况下就作为发言的预设前提了
|
|
113
rimutuyuan 2023-10-22 15:04:26 +08:00
|
|
114
orlog OP @rimutuyuan 好吧，您只要好好说话，我随时奉陪。这个事情是这样的：我前端加密主要就是为了不直接存储你的明文密码，并且让你知道，我真的没存，不信的话可以 f12 自己看到，就这样。。。至于后端的其他步骤，并不在这个小功能的涵盖意图范围之内
|
|
115
rimutuyuan 2023-10-22 15:11:01 +08:00
|
|
116
orlog OP @rimutuyuan 稳妥起见我在后端把你的 “abc” 也再单向哈希了一次，不过我觉得这个已经不重要了，你为什么需要知道这个呢？
|
 |
117
eaststarpen 2023-10-22 15:13:38 +08:00 1
@orlog
你真的知道密码加密或者 hash 的真正作用吗? 作为服务提供者/admin, 对任何用户的账户拥有 100% 权限(当然, 这里指整个服务提供方, 而不指具体的某一个人); 前台加密后后端 hash 存储的目的都是防止第三方攻击; 而不是防后端服务器 |
|
118
rimutuyuan 2023-10-22 15:17:18 +08:00 1
|
 |
121
chotow 2023-10-22 15:24:32 +08:00
不讨论 UI ，前端进行密码哈希的这个做法，大大点赞。
后端哈希是必须的，前端哈希则是锦上添花；许多人不明白这一点的意义，对我来说，「项目开源+前端明文提交密码」和「项目闭源+前端哈希提交密码」，我宁可选择后者。 |
|
122
orlog OP @rimutuyuan 黑客都能脱裤或者监听到你哈希后的 “abc” 了。。。就让他登录了吧，至少你原文密码不会被收录到社工库，至于防止脱裤，那是代码审计之类的工作吧
|
 |
124
kakki 2023-10-22 15:41:44 +08:00 via Android
关于这位 op 所谓的前端哈希。。。他的意思就是，我替用户防我自己。万一我数据被泄露出去，不至于让用户担心是否有存储明文密码的可能性，因为之前 csdn 这个草包就干过这种事，用户在所有平台一般都只会使用一个密码。
但其实有心人直接暴力生成海量彩虹表做 match 工作就行了。 |
|
125
orlog OP @kakki 哈哈这个有心人，暴力成本可有点高吧。。。具体我还没算过，不过我这可不是 md5 哦 ，彩虹表可能一两天做不出来的
|
|
128
orlog OP @kakki 好吧。。。假设我有一个机房的超级计算机，为了获取小论坛的用户密码明文，要预先做了个彩虹表，先花他个几年时间把机房算力跑满吧，听上去很疯狂，但也不是没可能
|
|
129
orlog OP @kakki 密码都是这样的，暴力破解只是时间和算力问题。但你觉得站长会花那么大代价做彩虹表的概率有多少？我宁愿相信那个密码是猴子乱敲键盘蒙对出来的，而不是通过预先做彩虹表
|
|
130
kakki 2023-10-22 16:06:47 +08:00 via Android
@orlog 你不妨说说你用的什么加密方式，可以算看下一天能生成多少条记录，大部分前端加密就我了解应该都只是一些简单哈希吧？一天能生成多少具体算了再看。
我还是坚持前端加密没有什么卵用，如果是 best practice ，不可能没有在业界推广开来。 虽然都说密码是时间和算力问题，但是很明显线性增长和指数增长不能混为一谈。 |
|
131
orlog OP @kakki 我前端加密用的是 pbkdf2 算法，秘钥长度 512 ，迭代次数 1024 。看得出来大佬是很懂的哦，不如帮我算一下吧！这个加密方案我预先要做个彩虹表出来的话，大约需要多少算力和时间？我把他写到网页上，谢谢哦！
|
 |
133
Achilless 2023-10-22 16:19:27 +08:00
这么有自信的话希望楼主找工作的时候把这个网站和这个帖子展示给面试官看哦
|
|
135
orlog OP |
|
136
kakki 2023-10-22 16:35:33 +08:00 via Android
@orlog 我不懂密码学，我的判断也只能基于一般的“为什么没有推广”来抛砖引玉。这个也不一定完全是技术因素，比如时代进步了，大家都使用手机验证码了，如果有研究密码学相关的专家能回答一下这个问题最好不过了。
|
 |
137
sunzhenyucn 2023-10-22 16:39:48 +08:00
好丑的设计 :)
|
 |
138
aulayli 2023-10-22 16:42:56 +08:00 via Android
无法访问了
|
|
139
orlog OP @kakki “为什么没有推广”，这种现象是很普遍的，各个领域里都是这样，只要你研究的足够深入，就会发现流行的东西都往往都不是最好的
|
|
140
orlog OP @sunzhenyucn 好丑的头像
|
 |
141
angry41 2023-10-22 17:05:25 +08:00
怎么说呢，算了，不说了。已看，留痕，加油！
|
 |
142
tool2d 2023-10-22 17:09:19 +08:00
用 http 真是一股清泉流。
密码光做 hash 其实不够，还要确保要抵制抓包重放攻击。我推荐 mysql 这个用户密码算法: The server sends a random string (scramble) to the client the client calculates: stage1_hash = SHA1(password), using the password that the user has entered. token = SHA1(scramble + SHA1(stage1_hash)) XOR stage1_hash the client sends the token to the server the server calculates stage1_hash' = token XOR SHA1(scramble + mysql.user.Password) the server compares SHA1(stage1_hash') and mysql.user.Password If they are the same, the password is okay. (Note SHA1(A+B) is the SHA1 of the concatenation of A with B.) |
 |
145
zhiyu1998 2023-10-22 19:05:22 +08:00
我开着 dark reader 一打开，哟 V2EX 2.0
我关了 dark reader ，哟 还真是 |
 |
146
chihiro2014 2023-10-22 19:15:17 +08:00
一些组件可以参考 uiverse ？
|
|
147
orlog OP |
 |
148
volatileSpark 2023-10-22 19:37:27 +08:00
背景和内容交织在一起，太难受了。打开一个网页总是先被背景分散注意力，然后要强行聚焦才能看到内容，而且明暗对比也不明显，眼睛有点适应不了
|
 |
149
bobryjosin 2023-10-22 19:45:33 +08:00
其实整个站看起来还是元素不协调，很花哨。
1.尤其是颜色，比如节点名称和回复数，一会是字变色一会是背景变色，暗色背景配亮色主题真的会瞎，而且颜色没有规律很杂乱，背景太花了可以参考 V2EX 的元素不多的背景。 2.注册和登录页的元素没对齐。 3.首页太多动图了...这个是真的看不下去，建议首页静态点进去再动态。 |
|
150
orlog OP @bobryjosin 因为背景图是随机变换的，也不想换用亮色的背景图，因为我网站风格是跟宇宙有关的，所以后续会想办法在保留现在随机暗色背景图的前提下，改善文字的识别度；元素没对齐，的确有很多细节地方还有疏漏；动图。。。默认主题我还是想保留，不过我会考虑这个建议，在简洁模式里去掉动图
最后谢谢你的建议，都打了挺多字 |
 |
151
ding2dong 2023-10-22 20:03:13 +08:00
再加个背景音乐，让我回味一下当年玩 qq 空间自定义的感觉
|
|
153
ding2dong 2023-10-22 20:08:59 +08:00
@orlog 搜 无版权背景音乐 看看。我记得当年挂的百度 mp3 的源，一些流行歌曲的纯音乐还是很好听的，比如 夜曲
|
 |
155
lk960511 2023-10-22 23:27:10 +08:00
跟风分享一下我的博客，rccblogs.com ，欢迎来访~~~
|
 |
156
maggch97 2023-10-23 00:13:29 +08:00
发现样式改了，但是我还想说，改啥都不如把毛玻璃改成黑色透明色，不知道为什么要执着于白色。
还有，数据库存储 hash 是基本常识...不知道为什么需要特别强调。前端还是后端 hash 在我看来基本没啥差别。 |
 |
157
8bryo4p5qn758Dmv 2023-10-23 02:42:21 +08:00
@cssk #5 我想还能丑到什么地步，打开一看我瞎了
|
 |
159
jiangteng 2023-10-23 09:43:53 +08:00
背景太杂，过于影响阅读
|
 |
160
awesomes 2023-10-23 10:10:16 +08:00
吓我一激灵
|
 |
161
maymayblog 2023-10-23 10:26:09 +08:00
背景改一下(黑夜/白天 我觉得就够了)，字体悬停效果改一下(明色提醒就够了，没必要强行立体)，我觉得就差不多了，内容可以慢慢丰富，但是这个排班很清晰，那种动效很多，配图符合大众审美的我倒是认为毫无意义，论坛应该内容 first,花里胡哨除了浪费服务器资源，还浪费我眼睛
|
 |
162
dj721xHiAvbL11n0 2023-10-23 10:42:56 +08:00
咱们背景图能换换嘛，感觉是上古世纪的背景图
|
 |
163
joeshero 2023-10-23 10:55:24 +08:00
功能该有的都有,这 ui 无法接受...
|
|
165
orlog OP @x2420390517 欢迎推荐素材图哦~ 要宇宙风格的，最好带点科技感的
|
 |
166
HelloWorld556 2023-10-23 11:03:42 +08:00
 邮箱已经存在为啥还要清空别的内容,是不是可以改进一下 |
|
167
orlog OP @HelloWorld556 后续会改成 ajax 的不刷新页面，谢谢反馈
|
 |
168
Zink99 2023-10-23 11:22:08 +08:00
不愧是程序员的审美...
|
 |
169
lihexinkai 2023-10-23 11:24:09 +08:00
高情商： 这个设计风格很有特点！ 低情商：不好看
 |
 |
170
snitfk 2023-10-23 11:30:12 +08:00
求求，这背景换一下吧，这把没近视的搞近视，近视的搞成深度近视。这设计根本就是和你建这论坛相违背的。
|
 |
171
huangzhiyia 2023-10-23 11:36:19 +08:00 via Android 1
希望你工作三年后再回头看看这个帖子
|
 |
172
vaaagle 2023-10-23 14:24:58 +08:00
“老年人”，有被冒犯到。
|
 |
174
spacebound 2023-10-23 14:39:41 +08:00
没有登录的状态下，发私信报错了
|
|
175
orlog OP @spacebound 收到，谢谢
|
 |
176
mahoo12138 2023-10-23 14:49:40 +08:00
极简后端，用的是 PHP 吗？
|
|
177
orlog OP @mahoo12138 看来是同道中人，知道 php 是动态语言里性能最好的？
|
 |
178
Dannyxx 2023-10-23 15:24:34 +08:00
本来没啥，但为什么右下角切换模式，那种正常的普通的不花哨的模式被称为“老人模式”？？？是在讽刺谁？？
|
 |
180
jiannei 2023-10-23 15:51:30 +08:00
还不错哦
|
 |
181
huyoa 2023-10-23 15:53:10 +08:00
看着太晕了，不友好，建议黑色背景就挺好
|
 |
182
baijiahei 2023-10-23 16:29:43 +08:00
手搓很赞
背景喧宾夺主 我是来看内容输出的 而不是这个花里胡哨的背景啊 老人模式还稍微能接受点 |
 |
183
HomeZane 2023-10-23 16:31:07 +08:00
白色的字体+随机的背景=随机到不好的体验
被随机的正常年轻人也会很难受的 高质量的电影，游戏的字幕可以深入看下，都是下功夫的 比如字体的阴影，描边，背景边框都可以区分字幕与内容的手段 不会构成太大的识别障碍和有正常的用户体验也是两个概念 最后说一句，手搓论坛很强拉，加油 |
 |
184
arfaWong 2023-10-23 16:40:01 +08:00
字体的效果看着太难受了，快瞎了
|
|
185
orlog OP |
 |
186
337136897 2023-10-23 16:43:17 +08:00
打不开了？
|
 |
187
littleylv 2023-10-23 16:51:07 +08:00
好奇楼主在日常工作中和同事讨论问题的时候是不是也是和回复里的一样的说话方式
|
 |
189
hackun 2023-10-23 17:24:28 +08:00
我劝你立刻把阴影背景图代码删了
|
 |
190
uilvn 2023-10-23 18:01:18 +08:00
|
|
191
uilvn 2023-10-23 18:01:47 +08:00
|
 |
192
wildseeder 2023-10-23 20:10:55 +08:00
OP 可以用 Chrome 自带的 Lighthouse 测一下，里面会给出具体的问题点 https://imgur.com/fVZcCJJ
|
|
193
orlog OP |
 |
194
kneo 2023-10-23 21:15:33 +08:00 via Android
加密是加密，哈希是哈希。
加密是可逆的，哈希不可逆。但是哈希通常可以重用。如果每次哈希结果都是一样的，则相当于密码（或者 token ）。如果被截获，也会成为安全问题。不过在正确使用 https 的场景下，这个问题现在没那么严重。 哈希通常可以让用户相信服务器没有保存密码原文，当服务器风险高于传输层风险的时候，这一点是有意义的。当然，前提是用户相信这个哈希是不可逆。 你原文说的是加密，看你后来的回复，好像是哈希的意思。我认为你的表达并不准确。 做点事情不易，想得到别人的尊重更不易。没必要反应过激。 |
|
196
kneo 2023-10-23 23:45:06 +08:00
@orlog 不。不管中文还是英文（ encryption ），哈希（ hashing ）都不属于加密。加密是与解密相对的，无法解密的过程不能定义为加密。而哈希只是一种相关的安全技术。在沟通中把哈希说成加密会造成相当大的误解，会被人理解成可逆的。
|
|
198
kneo 2023-10-24 00:27:42 +08:00 10
@orlog 看来您真的很喜欢抬杠。我已经很礼貌的指出你的错误了。看的出你平常很少与人沟通。这只是一个不专业的术语使用，我只是单纯指出来，也没有对你有任何贬低或者批评的意思。
（维基百科，不让发链接） 在密码学中，加密（英语：Encryption ）是将明文信息改变为难以读取的密文内容，使之不可读的过程。只有拥有解密方法的对象，经由解密过程，才能将密文还原为正常可读的内容。理想情况下，只有经授权的人员能够读取加密文所要传达的信息。 （维基百科，不让发链接） 散列函数（英语：Hash function ）又称散列算法、哈希函数，是一种从任何一种数据中创建小的数字“指纹”的方法。散列函数把消息或数据压缩成摘要，使得数据量变小，将数据的格式固定下来。该函数将数据打乱混合，重新创建一个叫做散列值（ hash values ，hash codes ，hash sums ，或 hashes ）的指纹。 自己仔细读一下定义。很显然，加密过程是 100%可逆，哈希过程 100%不可逆。 加密与哈希的交集是零。 这里“加密”指的就是 Encryption 这个术语对应的含义。密码学是 Cryptography 。 密码学当然包含加密与哈希。我前面提过了，这都是安全技术相关的概念。 至于你的回复，在我看来属于无赖逻辑了。自己品味一下吧。“哈希不属于加密”，与“密码学专业不应该学这个”，有任何逻辑上的联系？我感觉你就是单纯的想杠一下。 最后，我本来是不想再回复的。因为根据你之前的回复，我觉得你还会跟我杠。 我写这么多是给别人看的。一是提醒大家不要再犯类似的低级错误了。二是说清楚点，孰是孰非，让大家自己做判断。 业余不可怕，可怕的傲慢。 |
Select Language