A fresh mix of code snippets and tutorials

Disable Chrome XSS Auditor

Working on WordPress development and testing HTML forms in Chrome browser, I ran into the following error:

This page isn't working

Chrome detected unusual code on this page and blocked it to protect your personal information (for example, passwords, phone numbers, and credit cards).


As explained here, the XSS error happens when Chrome detects a possible cross-site scripting attack. So it blocks the request and displays the error. This strategy probably helps more than hurts, but whatever. I just need to test some forms in Chrome, so here’s how to do it.


The solution is to add the following HTTP header to the page request:


For WordPress users, this can be achieved by adding the following code snippet via functions.php:

// Add HTTP XSS Header
function shapeSpace_add_xss_header() {
	header('X-XSS-Protection: 0');
add_action('init', 'shapeSpace_add_xss_header');

Thanks to JanWillem for his help with this function :)

Done! Of course you should use this technique with caution, only on development environments and so forth. Never disable Chrome’s or any other browser’s XSS-protection is the best advice here. If you need to disable for your own testing/development purposes fine. Otherwise, don’t.

Bonus Example

Asked how/why this is necessary, here is an example showing how to implement the “add XSS headers” technique conditionally. Observe the following WordPress function:

// Conditionally Disable Chrome XSS Auditor
function shapeSpace_add_xss_header() {
	// this is to enable saving of custom code options that include <script> and other tags.
	// this is needed because the chrome browser blocks requests that include <script> et al.
	// no other pages or requests are affected by this function.
	// more info @ https://wp-mix.com/disable-chrome-xss-auditor/
	if (!is_admin()) return;
	$screen = get_current_screen();
	if (!property_exists($screen, 'id')) return;
	if ($screen->id === 'settings_page_my-plugin') {
		header('X-XSS-Protection: 0');
add_action('init', 'shapeSpace_add_xss_header');

You can read the inline comments for an explanation of what’s happening, etc. Basically this code disables Chrome XSS protection on a conditional basis, such that it only happens for admin users who are viewing a specific plugin screen in the WordPress Admin Area.

Learn more

Digging Into WordPressWordPress Themes In DepthWizard’s SQL Recipes for WordPress