How to handle in nex.js google recaptcha google.com and recapthca.net blocked

Question

In my next.js project i have Grecapthca component.

import axiosApi from '../lib/axiosApi';
import { responseError } from '../lib/errorHandle';
import dynamic from 'next/dynamic';
import { useRouter } from 'next/router';
import React, { createRef, useEffect } from 'react';
import Swal from 'sweetalert2';

const ReCAPTCHA = dynamic(() => import('react-google-recaptcha'), { ssr: false });

export const Grecaptcha = ({ intl, setGrecaptcha = null }) => {
    const recaptchaRef = createRef();
    const router = useRouter();

    useEffect(() => {
        if (typeof window !== 'undefined') {
            window.recaptchaOptions = {
                useRecaptchaNet: true,
            };
        }
    }, []);

    return (
        <div className="captcha-container mb-16">
            <div className="captcha-content">
                <ReCAPTCHA
                    sitekey={process.env.NEXT_PUBLIC_RECAPTCHA_SITEKEY}
                    ref={recaptchaRef}
                    onChange={() => {
                       setGrecaptcha(recaptchaRef.current.getValue());
                    }}
                    hl={router.locale}
                    onErrored={() => {
                        console.log('onErrored');
                    }}
                    onExpired={() => {
                        console.log('onExpired');
                    }}
                />
            </div>
            <div className="loading">
                <div className="preloader" />
            </div>
        </div>
    );
};

I change hosts file in System32 and block google.com and recapthca.net. I want to handle if google.com and recapthca.net domains blocked show error message in page.