外国网站 icp备案,wordpress 打包 转移,电子商务营销手段,做网站怎么开后台大三寒假赋闲在家#xff0c;闲来无事#xff0c;用了5天时间做了一个在线学习的小网站#xff0c;一鼓作气部署上线#xff0c;制作的过程比较坎坷。内心经历过奔溃#xff0c;也经历过狂喜。
按照惯例先放出网址#xff0c;欢迎大家来访问学习#xff1a;www.pbjlove…大三寒假赋闲在家闲来无事用了5天时间做了一个在线学习的小网站一鼓作气部署上线制作的过程比较坎坷。内心经历过奔溃也经历过狂喜。
按照惯例先放出网址欢迎大家来访问学习www.pbjlovezjy.com
咪猫学习网 (pbjlovezjy.com) 我采用的技术栈是SpringBoot MySQL Mybatis Vue.js Redis
虽然最开始有想过用微服务来做但后来考虑到这只是一个小网站秉持着杀鸡焉用牛刀的原则就直接采用前后端分离的架构来做了。
做这个网站的浅层目的主要是提供一些能够在线学习的资料比如之前在复习新思想、毛中特这些思政课的时候会发现找不到课后题的答案最后花费了很多时间东拼西凑才最终找齐感觉很浪费时间。
同时资料也很难做到随时随地背诵有时候上厕所想背一下都要把电脑上的PDF传到QQ里才能打开看看而且字体很小看着很累人。
所以我就做了一个能够在线学习的网站同学们不论是走路、坐车、吃饭还是睡觉只需要打开网页然后想看哪章点哪章就能在线复习了简直就是懒人福音非常nice。
做这个网站的深层目的是为了能够给更多的大学生提供便捷的资源获取渠道网络上的那些资料质量参差不齐像我以前年少、涉世未深的时候也经常被骗所以不希望有同学被一些不良商家割了韭菜无情坑骗买到不适合的资料。
因此我只收取少额的费用比如购买1门课1.2元5门课4.88元平均1门课不到1元钱在1年时间内可以无限次在线看为的是能够让更广大的学生同胞们能够负担的起。
同时勉强维持我运营维护的费用比如租一台服务器要大几百块购买资料也要小几百块平均一年的支出是千把块当前仍处于入不敷出的状态o(╥﹏╥)o也希望好心朋友们能捐赠一下。
我计划将捐赠和付费的金额用于购买更多资料的使用权在征得同意的前提下开源分享给那些有需要的学子们。
下面厚颜无耻贴个赞赏码如果愿意给俺捐款请务必备注清名称让我知道您是哪位好心人。 下面言归正传
我主要想说开发过程中3件令我感觉比较崩溃的事情
第1件事让我足足奔溃了1个晚上——数据录入。没错就是数据录入整个网站虽然只有2张表但content这张表却让我足足录入了6个小时... 起初我是想把数据直接写在html中但这样写死之后后期不方便维护所以我就想通过搭建一个html模板来实时获取数据库中的数据对数据进行展示。这样后期需要改动的时候我只需要打开数据库进行修改就好。html框架如下
template
div classapp sidebar-mini idappdiv :style{ marginLeft: this.$store.getters.status ? 70px : 240px, width:84% , marginTop: 60px }div classtile mb-4 h2 idtypography第一章新时代坚持和发展中国特色社会主义/h2/divdiv v-for(section, index) in sections :keyindexdiv classtile mb-4h4{{section.title}}/h4div v-for(part,index) in section.content :keyindexp styletext-align: left;font-size: 18px;line-height: 1.9;text-indent: 2em;{{part}}/p/div/div/div/div
/div
/template
但是数据录入数据库的过程真的很枯燥繁琐我也没想到有什么好方法能一次性把数据录入。
就拿新思想来举例一门新思想课程分为17个大章节在每个大章节里面还有4-5个问题这样一门课下来要录入6、7十条的数据一方面录入的数量很多另一方面还要考虑分段和展示的问题所以要求录入很精细速度很慢加上做的是重复动作因此感觉很疲劳崩溃。
甚至有那么一瞬间我似乎明白了程序员为啥会戏称自己为码农了。。
第2件事让我整整难受了1天。那当属用拦截器来做权限的管理。
之所以在我的这个网站中需要做权限的管理主要是为了区分出3类用户1.未登录用户。2.已登录用户但未付费。3.已付费用户。
不同类型的用户只能访问资源的不同章节比如未登录用户只能访问前10%的章节已登录但未付费用户只能访问前30%的章节只有付费用户才能访问全部章节。
之所以不敢让未登录用户访问太多章节的原因是怕出现安全问题。比如不排除某些“坏人”会通过疯狂访问公共资源来破坏数据库使其过负载。
有人可能会说你可以把公共资源放到redis缓存里呀这样你就不用害怕“坏人”DOS攻击了但很显然我想到了现在还没来得及这么做不过后面应该会做。
因此我选择仅开放一部分的资源另一部分资源用拦截器拦截下来避免对数据库造成冲击。
下面给大家简单看一下拦截器 实话说代码并不复杂 但逻辑比较复杂。比如JwtTokenAdminInterceptor这个拦截器主要是拦截未登录的用户放行公共资源。然后TestInterceptor这个拦截器主要是为了拦截未付费用户放行已登录用户能访问的所有资源。 然而这里面还有更复杂的比如用户购买2门课程可以是毛中特和新思想也可以是近纲和马原。
一开始我觉得这是一个排列组合的问题一个人在5门课中可以选择只买1门也可以选择全买也可以选择买2门或者3门或者4门。这样子的话组件的情况会变得非常多差不多是22种情况难道每种情况都要写一个拦截器吗
但经过我的苦思冥想实则是GPT给我的思路我采用了一个string来模拟bitmap当某1位上为5代表用户没购买当某1位上为1代表用户购买只需要把为5的资源对应的请求地址加入到拦截器中即可这样就可以实现只拦截用户没购买的资源。
之所以我最开始没想到这点还是因为对拦截器的性质不太熟练。
具体实现可以详见上面的代码。
第3件事让我整整难受了3天。那当属网站上线后改前端的界面和BUG。
因为在电脑上看页面屏宽很宽可以显示完全如下图 但因为手机屏幕的宽度只有450作用所以PC端看上去好好的界面一到手机上就会变成一坨*。 此时有2种解决方案
1.单独设置css样式PC端和移动端的代码使得用一套代码来实现2种页面效果。
2.写2套代码2套界面通过地址访问不同的界面。这种一般是早期的做法工作量太大。
秉持敏捷开发的原则我舍弃了第2种方法采用了第1种方法。
然后涉及到几个问题
比如学习制作自适应页面代码的语法然后一步步调试。
还有在一些不熟悉的css组间中反复挣扎一会儿组间要横向摆放比如“资源付费”界面一会儿要竖向摆放一会儿这个组件消失了一会儿那个组件被遮挡了要调位置还要调优先级。
一会儿这里好了一会儿那里出问题了在崩溃和喜悦之间反复横跳。
这里的过程就不多说了实在是辛酸的血泪史。
中间还有一些插曲比如说我的导航栏和侧栏是单独放在App.vue里的然后主体界面是在vuews里面就会涉及到不同组件之间共享变量的调用问题。 所以我感觉最难的根本不是后端代码而是前端代码。。。
好了好了接下来就说一些值得开心和喜悦的事吧。
第1件事当然是独立部署上线了一个网站能够让亲朋好友们在线访问跟他们说这是我的网站真心有满满的自豪感啊。
第2件事攻克了很多的困难从0-1搭建了一个网站包括后端和前端把一些学习到的知识现学现用活学活用加深了对知识的理解在过程中也很享受改BUG的过程当一切都基本完成之后心中的喜悦明显会居多。
下面是一些代办事项看着一件件待办事项被完成、划掉内心充满自豪感。 但是不可否认的是网站当前还存在有一些问题比如但不仅限于如下
1.没有把公共资源缓存到Redis中
2.SSL证书还没有办理导致网站属于不安全状态
3.数据库的设计不太合理不符合第3范式。
4.界面上仍旧有需要改进的地方比如在移动端显示下登录栏和注册栏时常会“分家”一个掉到下面一个挂在上面
5.还有登录和注册的安全机制仍旧有待加强比如还没有限制1人1手机只能注册1个账号登录的时候也没有验证码无法防止机器人恶意登录登录校验也没有用更安全的Spring Security仅仅只用了一个JWT的Token校验。
综上我想说的是尽管世界就像代码一样仍旧有许多不完美的地方但我相信在新的一年会通过你我的共同努力让其慢慢变得更好。
在此祝新老粉丝朋友们新的一年心想事成万事如意龙年大吉。对那些愿意给西风捐赠的老板们道一声诚挚的感谢。
