In the past, when I wanted to deploy a simple service, I would go to Heroku because it was simple and free, although there were some usage restrictions, overall it was very convenient, and there were even some simple databases available. For static web pages, I would choose Netlify or GitHub Pages, both of which are simple and convenient options.

However, Heroku stopped offering free plans after the end of 2022, so many people were looking for alternative solutions, including Render or fly[dot]io, which became popular choices for many. I used to have three or four projects on Heroku myself, but after the changes at Heroku, I never touched them again.

Recently, I received an email from the founder of Zeabur hoping to collaborate with me to promote this platform. After trying it out myself, I found the experience to be quite good, so I decided to write this article to introduce it.

Read More

If you have read my blog before, you should know that I have always been writing in React and have never touched Vue or Angular. Since I started using React in 2015, I have been using it for work.

However, recently due to work requirements, I started working with Vue. Coincidentally, some readers asked me about my insights on transitioning from React to Vue, so I decided to write a brief post to share my thoughts.

Read More

Last month’s (January 2024) Intigriti challenge was very interesting, made by @kevin_mizu. I have often seen him post client-side related challenges on Twitter before, and this time the quality of the challenge was as good as ever, worth documenting.

The challenge link is here, if you haven’t seen it yet, you can take a look: https://challenge-0124.intigriti.io/

Read More

Compared to last year and the year before, the difficulty of this year’s web challenges has significantly decreased, making them more approachable and beginner-friendly(It’s good to have both easy and difficult challenges). With the effort of my teammates, we managed to secure the first place, leaving only one web challenge unsolved.

This time, I only managed to solve the simple “funnylogin” and the challenging “safestlist” challenges. The rest were solved by my teammates. I also took a look at another challenge called “another-csp”. Therefore, this post will only cover the challenges I reviewed and the more difficult ones.

If you want to see other challenges, you can refer to other people’s writeups:

  1. st98 - DiceCTF 2024 Quals writeup
  2. 0xOne - 2024 Dice CTF Write up [Web]

All challenge source code provided by the organizers can be found at: https://github.com/dicegang/dicectf-quals-2024-challenges

Keyword list:

  1. crash chromium
  2. slower css style
  3. xsleak
  4. URL length limit
  5. service worker
  6. background fetch
  7. connection pool + css injection
  8. iframe width + css injection

Read More

This year’s 0CTF had a total of three web challenges, one of which was client-side. I only solved this particular challenge and managed to get the first blood. This post will briefly document my solution.

Keyword list:

  1. CSS injection
  2. CSS exfiltration

Read More

Due to being busy lately, I haven’t been participating in CTFs as much in the past two or three months. However, I still come across some interesting challenges on Twitter. Even though I don’t have time to solve them, I still take notes because if I don’t, I won’t be able to solve them later for sure.

This post mainly documents some web front-end related challenges. Since I might not have personally solved them, the content is based on references from others’ notes, with some personal insights added.

Keyword list:

  1. copy paste XSS
  2. connection pool
  3. content type UTF16
  4. multipart/mixed
  5. Chrome DevTools Protocol
  6. new headless mode default download
  7. Scroll to Text Fragment (STTF)
  8. webVTT cue xsleak
  9. flask/werkzeug cookie parsing quirks

Read More

Did you know that when you discuss SSR with your friends, it’s highly likely that your understanding of SSR differs? Let’s take a few scenarios. Which ones do you consider as SSR?

  1. Generating the view from the backend using PHP.
  2. Frontend is a React-based SPA, but if the backend detects a search engine, it switches to a different template that is specifically designed for search engines instead of the React-rendered page.
  3. Frontend is a React-based SPA, but it uses Prerender to render the page as HTML and then serves it to the search engine (regular users still get the SPA experience). The difference from the previous scenario is that the view seen by users and search engines is mostly the same.
  4. Frontend is a React-based SPA, and the backend uses renderToString to render React into a string, but there is no data. The data is fetched on the frontend.
  5. Frontend is a React-based SPA, and the backend makes API calls to fetch data for each page. After fetching the data, it calls renderToString to output HTML. On the client-side, hydration is performed to make the page interactive.

Some people believe that any view generated by the backend is considered SSR, so all scenarios 1 to 5 are SSR. Others think that the frontend must be an SPA for it to be called SSR, so scenarios 2 to 5 are SSR. Yet, some people consider hydration as the key aspect of SSR, so only scenario 5 (or 45) is SSR.

Read More

On November 9, 2023, Sentry published an article on their blog titled Next.js SDK Security Advisory - CVE-2023-46729. The article discusses the details of the CVE-2023-46729 vulnerability, including its cause, discovery time, and patching time.

Although the vulnerability was officially announced on 11/9, it was actually fixed in version 7.77.0 released on 10/31. Some time was given to developers to patch the vulnerability.

Now let’s briefly discuss the cause and attack method of this vulnerability.

Read More

Both of these competitions had many interesting but challenging problems. I really learned a lot.

Keyword list:

  1. nim json, null byte
  2. nim request smuggling
  3. js-yaml
  4. web worker
  5. blob URL
  6. meta redirect
  7. file protocol & .localhost domain
  8. sxg: Signed Exchanges
  9. 431 CSP bypass
  10. DOM clobbering document.body
  11. ejs delimiter
  12. Node.js + Deno prototype pollution gadget
  13. XSleaks golang sort

Read More

Some websites use GIFs for certain images because they are animated and appear more impressive than static images. Sometimes, the need for an animated image arises, such as in the case of stickers where animation is expected.

However, one of the well-known drawbacks of GIFs is their large file size. Especially on mobile devices with higher resolutions, larger images are required. Even if only a 52px image is displayed, a 156px image needs to be prepared, resulting in increased file size. In terms of web development, it is always better to have fewer and smaller resources to load.

Read More