Skip to main content
Categories
How To...LegalPerformanceSecurity

HOW TO: Prevent exposing your visitor’s data to the Chinese Communist Party through Tik Tok embeds

Embedding a TikTok link in your WordPress site can invoke over 100 external requests to CCP-related services like ByteOverSea (go ahead and check your network tab while adding a TikTok link to a post) – and that’s ok. While the title of this post is a tad “click-baity” – it’s super important that you are at least aware of how important it is to manage WordPress embeds (which are enabled by default).

So what’s all this about?

When you copy and paste a link into a post from Youtube, Twitter, TikTok, etc… WordPress’s embed script parses it into a pretty frame so your visitor doesn’t have to click through to the link. Instead of just having a link like https://www.youtube.com/watch?v=MrAJvgWnhB4, you instead get:

In general, there’s nothing to worry about in leaving the default WordPress oembed service as-is. In saying that, more security-sensitive projects (like intranet or military builds) really should take in consideration disabling embeds from the outset. As soon as a site author adds a link that’s automatically parsed by WordPress into a frame, a web admin has little control over where visitor data is disclosed as their browser will make several calls to third-party, external services, disclosing information like your visitor’s IP address and more.

In the case of TikTok, I’ve seen 100’s of requests generated from a single page load.

Ok I don’t have time to keep reading, how do I disable embeds?

Make a file called /wp-content/mu-plugins/disable-embeds.php and paste this code there:

<?php
add_action( 'init', function() {
    remove_action('rest_api_init', 'wp_oembed_register_route');
    remove_filter('oembed_dataparse', 'wp_filter_oembed_result', 10);
    remove_action('wp_head', 'wp_oembed_add_discovery_links');
    remove_action('wp_head', 'wp_oembed_add_host_js');
}, PHP_INT_MAX - 1 );

NOTE: This will break ALL embeds

This will break the API call made to generate the frame, if one of your site authors/editors pastes a link. The link is still shareable, but a visitor to that page needs to manually click-through. So at least you’re not forcing visitors to disclose potentially sensitive and identifying personal data simply by visiting your page.

Can I target specific oembed providers?

Perhaps there are some services you want to allow embeds to work with but not others (keep Twitter, but not TikTok).

WordPress actually has a function to support this called wp_oembed_remove_provider. You’ll need to add a line of code to your theme’s functions.php or pop this code into another mu-plugin:

<?php
if ( !function_exists( 'wp_oembed_remove_provider' ) ) { 
    require_once ABSPATH . WPINC . '/embed.php';} 
$format = 'https://www.tiktok.com/*'; 
$result = wp_oembed_remove_provider($format); 

Check out the Codex entry for this here.

But… the embed block still appears in Gutenberg

So, you’ve done the above and removed support for TikTok. But the block still appears when editing a page:

Let’s make another plugin to remove that block. Create the file /wp-content/mu-plugins/remove-tiktok-block.php and pop this in there:

<?php
function disabletiktok_enqueue() {
    wp_enqueue_script(
        'disable-tiktok-script',
        plugins_url( 'disable-tiktok/unregister.js', __FILE__ ),
        array( 'wp-blocks', 'wp-dom-ready', 'wp-edit-post' ),
        filemtime( plugin_dir_path( __FILE__ ) . '/remove-tiktok-block/unregister.js' )
    );
}
add_action( 'enqueue_block_editor_assets', 'disabletiktok_enqueue' );

Now create a JS file /wp-content/mu-plugins/remove-tiktok-block/unregister.js and paste this code in there:

wp.domReady( function() {
    wp.blocks.unregisterBlockType( 'core-embed/tiktok' );
} );

You can change the 'core-embed/tiktok' part of the JS file to any block you like to remove it.

Alternatively, you can specify only the blocks you want using a whitelist. Instead of the above code, you’d simply use this:

<?php
add_filter( 'allowed_block_types', 'misha_allowed_block_types' );
function misha_allowed_block_types( $allowed_blocks ) {
	return array(
		'core/image',
		'core/paragraph',
		'core/heading',
		'core/list'
	);
}

As an admin, you can actually disable any blocks you like without touching code using the Block Manager. When editing a page or post click the three dots icon on the top right and under Tools, select the Block Manager:

You’ll see the following popup:

From here you can disable any blocks you like, but just bare in mind they can be enabled again by any other admin, so the hardcoding approach is best from a security perspective.