react仿追书神器——哦豁阅读器
来源:互联网 发布:mac日历添加节日 编辑:程序博客网 时间:2024/05/16 18:20
前言
都知道追书神器从某个版本开始就不支持换源了,开始实行收费制度,虽然老版追书神器依然可以使用,但是指不定那天就挂掉了。再加上最近想熟悉一下react
,所以本项目哦豁阅读器
就诞生了。http://blog.shanamaid.top/
Github项目地址:https://github.com/ShanaMaid/oho-reader
欢迎issue
,pr
,star
or follow
!我将继续开源更多有趣的项目
推荐一个之前用Vue全家桶写的 网易云音乐PC端 web版本
哦豁阅读器(oho-reader)介绍
哦豁阅读器!API源自追书神器,免费使用!
实现追书神器核心功能,做到小说阅读的极简体验,把每一分流量都用到刀刃上!
在线版:http://www.shanamaid.top:3001
服务器带宽较小,初次加载比较慢,请谅解!建议clone
到本地进行体验!
Github项目地址:https://github.com/ShanaMaid/oho-reader
Oho阅读器的优势
oho阅读器初次打开时候加载比较慢,一部分原因是服务器带宽较小,另一部分是因为初次需要下载700kb
左右的文件,建议初次下载在wifi下进行。初次下载后oho阅读器会自动进行缓存,以后每次打开页面基本是秒开,消耗流量约在1KB
不到。
同时oho器抛弃所有与小说阅读无关的信息,真正做到极简!保证每一分流量都用到小说内容的阅读上,真正做到每章内容加载所用的流量集中在小说章节内容上,视章节字数而定,一般在5kb
左右。
oho阅读器目前由于服务器配置、带宽过小原因暂不支持章节内容缓存。
效果Gif图
实现功能
- 小说搜索
- 小说详情
- 小说换源
- 小说阅读
- 阅读字体大小变化
- 阅读背景色变化
- 阅读设置本地缓存
- 阅读进度本地缓存
- 搜索历史本地缓存
使用
1234567891011121314151617
git clone https://github.com/ShanaMaid/oho-reader.gitcd oho-readernpm install# 开发环境npm run serve访问 http://localhost:8080/# 打包npm run dist# 实际环境cd servernode app.js访问 http://localhost:3001/
目录结构
12345678910111213141516171819202122
||—— api 追书神器API说明|—— cfg webpack配置|—— dist 服务端| |—— app.js 服务端启动入口文件| |—— assets 打包后的资源文件| |—— static 静态资源| |__ index.html 网页入口||——src 资源文件| |—— images 图片资源| |—— components 组件库| |—— method 一些自定义方法,目前是过滤器| |—— filters 自定义过滤器| |—— redux| | |—— action| | |—— reducer| | |__ store| |—— router 路由管理| |—— styles 样式文件| |__ index.jsx 入口|_________________________________________________
一些注意事项
项目中使用追书神器的接口,需要使用http-proxy-middleware
进行转发,开发环境下需要在cfg/base.js
中的dev
中添加下列配置即可
123456789101112
proxy: {'/api': {target: 'http://api.zhuishushenqi.com/',pathRewrite: {'^/api' : '/'},changeOrigin: true},'/chapter': {target: 'http://chapter2.zhuishushenqi.com/',pathRewrite: {'^/chapter' : '/chapter'},changeOrigin: true}}
实际环境中,服务器端配置
123456789101112131415161718192021222324
var express = require('express');var proxy = require('http-proxy-middleware');var app = express();app.use('/static', express.static('static'));app.use('/assets', express.static('assets'));app.use('/api', proxy({target: 'http://api.zhuishushenqi.com/',pathRewrite: {'^/api' : '/'},changeOrigin: true}));app.use('/chapter', proxy({target: 'http://chapter2.zhuishushenqi.com/',pathRewrite: {'^/chapter' : '/chapter'},changeOrigin: true}));app.get('/*', function (req, res) {res.sendFile(__dirname + '/index.html');});app.listen(3001);
支持
BUG提交请发送邮箱: uestczeng@gmail.com
Github项目地址:https://github.com/ShanaMaid/oho-reader
欢迎issue
,pr
,star
or follow
!我将继续开源更多有趣的项目
你的支持将有助于项目维护以及提高用户体验,感谢各位的支持!
后续计划
过段时间计划把oho-reader
迁移到react-native
,具体时间可能要看什么时候有空了。
总结
最近粗略使用了一下vue
与react
,大致感觉就是前者是在html
里面写js
,后者是在js
里面写html
,就目前来看两者现在基本上是势均力敌、各有千秋,未来的具体走向如何谁都说不准,当然这是我的个人见解。如果你有什么好的建议或者说值得探讨的话题,可以在下方留言。
- react仿追书神器——哦豁阅读器
- React开发神器Webpack
- 新版小说阅读器 ----追书神器收费
- Android阅读器——FolioReader
- 微信小程序—新闻阅读器
- java项目—文本阅读器
- React(二):React开发神器Webpack
- Android学习15——RSS阅读器
- CentOS7—C++阅读器—source Insight
- 【报表神器】——ECharts
- 写作神器——Latex
- Hydra—密码爆破神器
- 深入浅出React(二):React开发神器Webpack
- 深入浅出React(二):React开发神器Webpack
- 深入浅出React(二):React开发神器Webpack
- 深入浅出React(二):React开发神器Webpack
- 深入浅出React(二):React开发神器Webpack
- React控件——React-ui
- Telnet与SSH协议
- mysql字符集
- 机器学习中训练数据集,交叉验证数据集,测试数据集的作用
- java端发送数据给fafka不成功的问题
- dp——洛谷P2822 组合数问题
- react仿追书神器——哦豁阅读器
- Cg学习之01_vertex_program
- (四)运输层协议——UDP
- android关于AndroidManifest.xml详细分析
- 4.14
- 最近整理的一些msm8909平台英文文档4
- ocp 笔记2
- Barcodes and SAPscript forms
- 德国的强大,在小学教师的讲台上就决定了