我有一个开发了快两年的 PWA V2EX App 和大家分享……

2019-05-17 09:26:36 +08:00
 morethansean
事情的起因是这样的,在 17 年中旬,体验了一把被称为是 Sketch 竞品的,还处在 beta 阶段的 Adobe XD, 做了一个 V2EX 的移动端 redesign.
然后就开始了断断续续长达两年的开发之旅 _(:з」∠)_


(当时的设计稿)

最初做这个东西的原因,其实是一个很简单的需求:时逢多事之年,各种想要关注的帖子被丢进隐藏节点无法 follow 进度,所以想做一个 follow 帖子的功能把这些帖子的更新直接展示到首页区。
断断续续开发了一个月左右,由于有其他几个内容创作相关的 side project 占据了大量时间,这个项目就停止了,毕竟,当时的半成品已经够自用了……
直到,前段时间突然看到有人发帖问这个 PWA 是什么……于是就抽了点时间,把他做了一个勉强能使用的初版。
这两年发生的事情太多了,包括审美上的变化,让这个 app 的设计很多地方已经显得陈旧过时;随着 Web 的发展,Polymer 也从迈入了 3.0 的时代,它抛掉 html imports 拥抱 ES modules,从 bower 迁移到 npm. 这些种种的更迭,也是当初让我放弃继续开发这个 app 的原因之一:总想把一个东西做到最好,所以要保持所有部分都是最好用的零件……比如过旧的设计无法驱动我获得实现时的快感后,当然就没有动力继续做下去了……所以本来是想再重新更新一下设计以及更新底层框架之后再继续做的……
至于,为什么突然又有了动力,这是另外一个话题了,废话说了一大堆,还是简单介绍一下功能吧:

首先,这是一个手机端的 Web 应用,准确地说是运行在非 iOS 系统下的 Chrome 上的应用(不过交互设计和代码实现都是移动端的,所以 desktop 上很 buggy )。
得益于 Google 自己对 PWA 的推广和支持,你可以把这个 App 像 Native 应用一样安装到 Android 手机里并像 Native 应用一样使用,并实时获取最新提醒的 push 通知。

下面是几张截图预览:





一些小功能:

- 长按快速预览主题
- 楼层内联回复内容
- 图片查看器
- 分享你感兴趣的主题
- 查看历史浏览记录
- 获取新消息通知

一些正在开发的功能:
- 跟踪帖子,并获取他们的更新提醒(咦,这不是当初我的第一功能要求吗)
- PIN 码界面增加使用指纹传感器的选项
- 优化现在的 emoji 输入器

至于,怎么体验这个 PWA 版本的 V2EX 呢?
你需要一个可以提供 https 访问的服务器来部署他,因为 V2EX 并没有提供什么真正可以使用的三方 API.
如果你熟练的话,整个安装过程应该在 10 分钟以内,访问下面的链接获取指引: https://github.com/7nights/get-v2ex

简单介绍一下,这个程序会通过访问 V2EX 来提供 RESTFul 的 API 让你的 PWA 程序调用,出于安全原因考虑,他基本上只支持一个用户(其实支持多用户估计也会被 V2 反爬的)。

再多嘴一句,请使用 https, 不仅仅是因为大部分功能(比如分享、通知推送等等)都需要 https,还是为了你自身账号安全着想……

有任何 bug 或者建议都可以提到 issues 里。谢谢大家啦~
20410 次点击
所在节点    PWA
129 条回复
1762628386
2019-05-17 16:08:34 +08:00
没有 web 版?
nanau2016
2019-05-17 16:10:16 +08:00
如果 IG 上那个 7nights 是楼主的话,不仅有才华,还真 tm 的帅
morethansean
2019-05-17 16:13:50 +08:00
@nanau2016 #82
哈哈哈哈哈熟人啊,爱你哦。
goodboy886
2019-05-17 16:14:11 +08:00
厉害了,漂亮
daryl
2019-05-17 16:17:49 +08:00
会 UI 的程序员真可怕
wolfie
2019-05-17 16:19:25 +08:00
好看,第一张图是一个整理软件还是图片管理器。
cccicl
2019-05-17 16:21:16 +08:00
会 UI 的程序员真可怕
leefly
2019-05-17 16:25:41 +08:00
@VENTDOUX 现在 ios 也支持 PWA 了 (残缺版本
BCy66drFCvk1Ou87
2019-05-17 16:43:29 +08:00
硬核
uTOmOuk3L6sb4MSI
2019-05-17 16:46:39 +08:00
对方不想说话,并向你抛出一个错误:

```

(node:661) ExperimentalWarning: The fs.promises API is experimental
task runner established!
get-v2ex is listening on port 3003!
Get task { taskId: 'fetch-notifications',
interval: 600000,
next: 1558082619038,
start: 1558082619038,
runner: '127.0.0.1' }
(node:661) UnhandledPromiseRejectionWarning: Error: User does not sign in
at Object.exports.get (/home/ubuntu/get-v2ex/lib/userrequest.js:39:39)
at taskQueue.onRun (/home/ubuntu/get-v2ex/tasks/index.js:28:60)
at (anonymous function).forEach.func (/home/ubuntu/get-v2ex/lib/taskrunner/index.js:258:11)
at Array.forEach (<anonymous>)
at TaskQueue.executeTask (/home/ubuntu/get-v2ex/lib/taskrunner/index.js:257:30)
at processTicksAndRejections (internal/process/next_tick.js:81:5)
(node:661) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:661) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

```
uTOmOuk3L6sb4MSI
2019-05-17 16:50:21 +08:00
能访问,就是一直提示未登录,获取不到数据;话说配置了用户名&密码,用户验证码你是怎么处理的。
我尝试访问登陆页面,验证码图片是 500,获取不到惹。
ww980624
2019-05-17 16:53:37 +08:00
会 UI 的程序员真可怕
morethansean
2019-05-17 16:59:50 +08:00
@ODD10 #90
你是不是没有 follow 文档执行 npm init 来登录...
Lin0936
2019-05-17 17:00:20 +08:00
部署上了,但是 captcha 请求(好像是验证码)一直 404.
uTOmOuk3L6sb4MSI
2019-05-17 17:04:53 +08:00
@morethansean #93
好了,我开始没 config.js 就 init 了!
重新 init 一次,再启动程序,正常了
uTOmOuk3L6sb4MSI
2019-05-17 17:07:33 +08:00
Lin0936
2019-05-17 17:13:11 +08:00
@ODD10 请问一下全局请求添加‘/static ’那块是怎么配置的
uTOmOuk3L6sb4MSI
2019-05-17 17:14:25 +08:00
手机上字体图标加载不出来。开了 ss 也没用。
uTOmOuk3L6sb4MSI
2019-05-17 17:15:15 +08:00
@Lin0936 #97
nginx 鸭,文档里面写了鸭,复制就行鸭,傻瓜式的鸭
morethansean
2019-05-17 17:17:08 +08:00
@ODD10 #98
iOS 上已知问题,iOS 还有一堆其他的 bug

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/564917

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX