Recently, a reader shared with me a Chrome extension he created: JP NEWS Helper, which can summarize and translate articles from NHK News Easy, helping to learn Japanese.

Since this extension is open source, my first curiosity was: “Which AI service does it use, and how is the key handled?” After looking at the source code, I found out that it actually uses Chrome’s built-in Web API, not the HTTP API I had assumed.

It was a bit of a late realization for me to discover that there are built-in Web APIs available, so I decided to write a short article to document it.

Read More

Recently, I received an email from a reader asking if I could write an article explaining XSS without parentheses and semi-colons, saying that the payloads in it were hard to understand.

Therefore, this article will briefly explain these payloads, referencing Gareth Heyes’ two articles:

1. XSS technique without parentheses
2. XSS without parentheses and semi-colons

Read More

As a front-end engineer who deals with web pages every day, it is quite reasonable to be familiar with the use of DevTools. Whenever there is an issue with an API, I just press the shortcut to open DevTools, switch to the Network tab, find the red line, right-click to copy it as cURL, and paste it into the group chat for the backend team to troubleshoot.

But I wonder if anyone has encountered situations where DevTools are not sufficient. What should we do then?

Read More

Many people might have followed the news three weeks ago about the well-known extension Material Theme being proactively removed from VS Code by Microsoft. So what was the reason for its removal? Depending on your source of information, there might be two answers:

1. It “allegedly” contains malicious code.
2. It is indeed malware.

Read More

When you want to send some tracking-related information to the server from a webpage, there is another option that is often recommended over directly using fetch to send requests: navigator.sendBeacon.

Why is this recommended?

Because if you use the usual method of sending requests, there may be issues when the user closes the page or navigates away. For example, if a request is sent just as the page is being closed, that request may not go through and could be canceled along with the page closure.

Although there are ways to try to force the request to be sent, these methods often harm the user experience, such as forcing the page to close later or sending a synchronous request.

navigator.sendBeacon was created to solve this problem.

Read More

It’s been a while since I wrote writeup. I’ve wanted to write for a long time but kept procrastinating. For something like CTF writeups, speed is quite important because most discussions happen in Discord after the competition. Over time, it’s harder to find information, and it’s very likely to forget, so I need to quickly write a writeup to record those useful pieces of information.

This article brings together writeups for three CTFs. Some I didn’t play myself; I just looked at others’ writeups and take a note of them.

Keyword list:

1. bfcache
2. response splitting
3. Service-Worker-Allowed
4. gunicorn script_name
5. socket.io disconnect
6. socket.io JSONP CSP bypass
7. performance API
8. streaming HTML parsing
9. content-type ISO-2022-JP

Read More

In idekCTF 2024, there was an interesting problem called srcdoc-memos from @icesfont, which involved a lot of knowledge related to iframes. I did not actually participate in the competition, but after the event, I looked at the problem and the solution, and it took me several days to finally understand why. It is definitely worth documenting the process and the solution.

Since this problem involves a lot of knowledge related to iframes, I will try to explain it step by step for better understanding.

Read More

For the past half year, I have been busy with other things and haven’t had a chance to participate in a CTF. This time, I made time for GoogleCTF 2024 and solved all the web challenges with my teammates.

The challenges were interesting as always. I participated in three of them, while my teammates quickly solved the other two simpler ones before I could even take a look. Nevertheless, I will make a brief record of them. I really enjoy CTF challenges that are mostly client-side focused.

Keywords:

1. Bypassing URL parser
2. Adding strings after parseInt
3. [a-Z] regex includes special characters
4. Cookie tossing
5. CSS injection

Read More

Polyfill.io is a service that automatically provides front-end polyfills, making it very convenient to use. You just need to select the functionality you want to polyfill and then include a JavaScript file like this:

<script src="https://polyfill.io/v3/polyfill.min.js"></script>

The server will automatically determine based on the user-agent whether to return a polyfill, so only the necessary code will be included. It sounds convenient and useful.

However, some people may have received notifications from Google Ads recently about a security issue. Why is that?

Read More

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