https://github.com/jiacai2050/pageview-worker

Page View backend based on Cloudflare Workers and KV.
https://github.com/jiacai2050/pageview-worker

cloudfare-api cloudflare cloudflare-worker cloudflare-workers pageview

Last synced: 2 months ago
JSON representation

Page View backend based on Cloudflare Workers and KV.

• Host: GitHub
• URL: https://github.com/jiacai2050/pageview-worker
• Owner: jiacai2050
• License: gpl-3.0
• Created: 2023-04-05T06:53:49.000Z (almost 2 years ago)
• Default Branch: main
• Last Pushed: 2023-04-24T13:11:00.000Z (over 1 year ago)
• Last Synced: 2024-11-07T23:40:07.943Z (2 months ago)
• Topics: cloudfare-api, cloudflare, cloudflare-worker, cloudflare-workers, pageview
• Language: JavaScript
• Homepage: http://jiacai2050.github.io/pageview-worker/
• Size: 405 KB
• Stars: 41
• Watchers: 2
• Forks: 2
• Open Issues: 0
• Metadata Files:
  • Readme: README.org
  • License: LICENSE

Awesome Lists containing this project

• awesome - jiacai2050/pageview-worker - Page View backend based on Cloudflare Workers and KV. (JavaScript)

README

        
#+TITLE: Pageview Worker

#+DATE: 2023-04-05T15:09:21+0800

#+LASTMOD: 2023-04-05T15:09:21+0800

#+AUTHOR: Jiacai Liu

#+OPTIONS: toc:nil num:nil

#+STARTUP: content

Page View backend based on [[https://developers.cloudflare.com/workers/][Cloudflare Workers]] and [[https://developers.cloudflare.com/workers/runtime-apis/kv/][KV]].

[[file:pageview.jpg]]

Live demo:

- https://jiacai2050.github.io/pageview-worker

There are two pages containing [[file:demo/tracking.js]] for this live demo:

- [[https://jiacai2050.github.io/pageview-worker/demo1.html][Demo 1]]

- [[https://jiacai2050.github.io/pageview-worker/demo2.html][Demo 2]]

#+begin_quote

⚠️ Demo pages will collect your IP/Country/City, click at your own risk.

#+end_quote

* Use at you own website

- Setup workers, refer to [[https://developers.cloudflare.com/workers/get-started/quickstarts/][quickstarts]]

  - Publish [[file:worker.js]]

- Add KV binding, refer to [[https://developers.cloudflare.com/workers/runtime-apis/kv/][referencing KV from Workers]]

  - Binding name is =KV= in this project.

- Add following tracking code to HTML files you want to track, replace =apiEndpoint= with your worker address.

  #+begin_src js

const apiEndpoint = 'https://pageview-demo.jiacai2050.workers.dev/write';

const payload = {

  'url': document.location.href,

  'title': document.title,

  'referrer': window.frames.top.document.referrer,

};

fetch(`${apiEndpoint}?${new URLSearchParams(payload)}`, {mode: 'no-cors'})

  .catch(console.log);

  #+end_src

- Then when visit HTML, following information will be saved to KV via workers:

  - URL

  - Title

  - Referrer

  - User-Agent

  - IP

  - Country

  - City

- [[file:demo/index.html]] is provided to view saved pageviews.

  - Replace =apiEndpoint= with your worker address.

* Other fun workers project

- [[https://github.com/eidam/cf-workers-status-page][Status page]]

- [[https://github.com/honojs/hono][honojs/hono: Ultrafast web framework for the Edges]]

- [[https://github.com/cloudflare/miniflare][cloudflare/miniflare: Fully-local simulator for Cloudflare Workers]]

* License

[[file:LICENSE][GPL-3]]