cloudflare workers应用系列之3: 博客点赞功能
cloudflare workers应用系列之3: 博客点赞功能

emaction.frontend
emactionUpdated May 11, 2024
 

cloudflare workers应用系列之3: 博客点赞功能

workers应用之: 博客点赞功能
emaction 是一个标准 web component,可以用在任何页面中。
后台在cloudflare中搭建, 前台一个js文件搞定 只需两行代码,即可为页面添加 emoji reaction 功能。

通过 CDN 引入(推荐)

然后在相应的post页面中放入下面代码就OK了

进阶使用:

reactTargetId 指定相应的id, 可以用post.id, 或post.slug或直接用post.title.这样从后台可以直观查看点赞结果. 增加”reactTargetId”参数 并且可以在列表页和详情页共用一个结果. endpoint指定自己搭建的后台
notion image

这是后台的结果_________

💡
测试
id
target_id
reaction_name
count
created_at
updated_at
1
围城之外
thumbs-up
1
14
1
 

自己搭建一个免费后端:

  1. 新建一个D1数据库
    1. notion image
      • 名字起个容易区分的,可以人工创建表, 也可以命令行创建表
      • 人工:
        • notion image
      • 命令行
        • notion image
      • 命令
  1. 新建一个workers
    1. notion image
      notion image
       
      notion image
    2. 代码如下, 替换原来的代码后, 进行部署.
  1. 绑定域名,绑定数据库,绑定域名.
      • 在该workers的设置- 触发器里,绑定一个域名,因为默认的被墙了.
      • 在该workers的设置- 变量里, 进行D1数据库绑定.
  1. 再返回编辑代码, 再点开域名,https://api-emaction.xxxxx.workers.dev/ 后是一张404的照片, 就表示成功了.
    1. notion image