> ## Content Index
> Fetch the complete content index at: https://devakatalk.com/llms.txt
> Use this file to discover other available public pages before exploring further.

# Why Your Bookmarklets Are Not Working on Some Websites and How to Bypass CORS
- URL: https://devakatalk.com/why-your-bookmarklets-are-not-working/
- Published: 2025-02-09T10:51:43.000Z
- Updated: 2026-10-23T10:49:03.000Z
- Author: Serhii Koksharov
- Tags: Main, bookmarklets, #wp, #wp-post, #Import 2026-10-22 20:07

When trying to run js-bookmarklets on certain websites, you may encounter an issue where they simply don't work. One common reason for this is [CORS](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS?ref=devakatalk.com) (Cross-Origin Resource Sharing) policies, which restrict how web pages can interact with resources from different origins. For example, [DevakaTools Bookmarklet](https://devakatalk.com/devaka-tools/) won't run on such a websites. In this article I'll show how to make your bookmarklets work using Overrides in Chrome DevTools.

## What is CORS

CORS is a security feature implemented by browsers to prevent malicious websites from accessing resources and data on other websites without permission. When you try to run a js-bookmarklet that makes a request to a different domain (such as loading an external script or making an API call), CORS policies may block this action if the destination site does not allow cross-origin requests. And the bookmarklet won't function as intended.

## How to Bypass CORS Using Chrome DevTools Overrides

Chrome DevTools provides a powerful set of tools for web developers, one of which is the [Overrides](https://developer.chrome.com/docs/devtools/overrides?ref=devakatalk.com) feature. This feature allows you to modify and override various HTTP request headers, including those related to CORS, enabling you to bypass the CORS restrictions for testing purposes.

### Steps for Setting Up Overrides in Chrome DevTools

1\. **Open Chrome DevTools**

Right-click on the page where your bookmarklet isn't working and select **Inspect**, or press `Ctrl + Shift + I` (Windows) or `Cmd + Option + I` (Mac) to open DevTools.

2\. **Navigate to the Network Panel**

Go to the **Network** tab in DevTools. This will allow you to monitor and interact with network requests made by the webpage.

3\. **Right-click a Request You Want to Override**

Right-click on a network first request in the **Network** panel. First request is for current document you navigating on.

![](https://devakatalk.com/content/images/devakatalk-com/wp-content/uploads/2025/02/znimok-ekrana-2025-02-09-o-10-37-25.png)

From the drop-down menu, choose **Override headers**. Or find header named "Content-Security-Policy" and click pen at the right side.  

![](https://devakatalk.com/content/images/devakatalk-com/wp-content/uploads/2025/02/znimok-ekrana-2025-02-09-o-10-36-50.png)

4\. **Set Up Local Overrides (If You Haven’t Done It Yet)**

If you haven’t set up local overrides yet, DevTools will prompt you to select a folder to store the override files.

Click **Select folder** and choose or create a folder on your local machine to store the override files.

DevTools will then ask for permission to grant access to this folder. Click **Allow** to grant the necessary access rights.

5\. **Make Changes to Your Request**

Once local overrides are set up and enabled DevTools will take you to **The Network > Headers > Response Headers** section if you're modifying response headers, such as the `Content-Security-Policy` header to bypass CORS restrictions.

Change all the content of Content-Security-Policy header to "\*" (asterisk mark).

![](https://devakatalk.com/content/images/devakatalk-com/wp-content/uploads/2025/02/znimok-ekrana-2025-02-09-o-10-57-28.png)

6\. **Save and Test**

After making the necessary changes (e.g., adjusting headers to allow cross-origin requests), save your changes and reload the page to see the effect. Your bookmarklet should now be able to run without CORS issues.

7\. You can setup overrides for all pages for that domain or remove your overrides. For that go to **Sources** tab and find **Overrides** section.

![](https://devakatalk.com/content/images/devakatalk-com/wp-content/uploads/2025/02/znimok-ekrana-2025-02-09-o-10-38-46.png)

For a more detailed guide on using overrides in Chrome DevTools, you can refer to the official documentation here: [Chrome DevTools Overrides Documentation](https://developer.chrome.com/docs/devtools/overrides?ref=devakatalk.com).

This short video will help you to understand the process of setting Overrides and enabling js-bookmarklets.

If you'll have any questions don't hesitate to ask.