How to pass data from JS to PHP for a plugin

[SachinSAgrawal]

I made a plugin that runs some javascript to get info about the device the code is run on (such as battery, screen size, etc) that I then save to a cookie which can be read the next time the user visits the site. However, that is not great because I want the most accurate information, and the next time the user visits the site if at all, that information could be different. How do I pass the information from the javascript back to the PHP? I tried making a form and then checking if the post is set, but it doesn't work

Here is my code:

function yourls_log_redirect( $keyword ) {
	// Allow plugins to short-circuit the whole function
	$pre = yourls_apply_filter( 'shunt_log_redirect', false, $keyword );
	if ( false !== $pre ) {
        return $pre;
    }

	if (!yourls_do_log_redirect()) {
        return true;
    }

	$table = YOURLS_DB_TABLE_LOG;
    $ip = yourls_get_IP();
    
    $sanitized_keyword = yourls_sanitize_keyword($keyword);
    
    echo <<<EOD
    console.log("Hi");
    <form id="deviceInfoForm" method="post" style="display: none;">
        <input type="hidden" id="deviceInfoInput" name="deviceInfo" value="">
    </form>

    <script>
        var orientation = window.orientation;
        var language = navigator.language;
        var isTouchScreen = "ontouchstart" in window || navigator.maxTouchPoints > 0;
        var width = screen.width;
        var height = screen.height;
        var isIncognito = false;
        try {
            isIncognito = window.sessionStorage.getItem("test");
            window.sessionStorage.setItem("test", "test");
        } catch (e) {
            isIncognito = true;
        }
        var adBlockEnabled = false;
        async function detectAdBlock() {
            const googleAdUrl = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
            try {
                await fetch(new Request(googleAdUrl)).catch(_ => adBlockEnabled = true);
            } catch (e) {
                adBlockEnabled = true;
            } finally {
            }
        }
        detectAdBlock();

        if ('getBattery' in navigator) {
            // The getBattery() API is supported
            navigator.getBattery().then((battery) => {
                var batteryLevel = battery.level * 100;

                var deviceInfo = "Ori:" + orientation +
                                    " Lang:" + language +
                                    " Touch:" + (isTouchScreen ? "Yes" : "No") +
                                    " Bat:" + batteryLevel + "%" +
                                    " Incog:" + (isIncognito ? "Yes" : "No") +
                                    " AdBlock:" + (adBlockEnabled ? "Yes" : "No") +
                                    " Size:" + width + "x" + height;

                document.getElementById("deviceInfoInput").value = deviceInfo;
                console.log(document.getElementById("deviceInfoInput").value)
                document.getElementById("deviceInfoForm").submit();
                console.log("Submitted");
            });
        } else {
            // The getBattery() API is not supported

            var deviceInfo = "Ori:" + orientation +
                                " Lang:" + language +
                                " Touch:" + (isTouchScreen ? "Yes" : "No") +
                                " Bat:undefined" +
                                " Incog:" + (isIncognito ? "Yes" : "No") +
                                " AdBlock:" + (adBlockEnabled ? "Yes" : "No") +
                                " Size:" + width + "x" + height;

            document.getElementById("deviceInfoInput").value = deviceInfo;
            console.log(document.getElementById("deviceInfoInput").value)
            document.getElementById("deviceInfoForm").submit();
            console.log("Submitted");
        }
    </script>
EOD;

    // Retrieve device information if present
    $deviceinfo = isset($_POST['deviceInfo']) ? $_POST['deviceInfo'] : '';
    
    // Get the real referrer
    $referrer = substr( yourls_get_referrer($sanitized_keyword), 0, 200 );
    
    // Append the device info to it
    $referrer_device = $referrer . " - " . $deviceinfo;
    
    // Debugging: Print raw data to browser console
    echo '<script>';
    echo 'console.log("' . $referrer_device . '");';
    echo '</script>';
    
    $binds = [
        'now' => date( 'Y-m-d H:i:s' ),
        'keyword'  => $sanitized_keyword,
        'referrer' => $referrer_device,
        'ua'       => substr(yourls_get_user_agent(), 0, 255),
        'ip'       => $ip,
        'location' => yourls_geo_ip_to_countrycode($ip),
    ];

    // Try and log. An error probably means a concurrency problem : just skip the logging
    try {
        $result = yourls_get_db()->fetchAffected("INSERT INTO `$table` (click_time, shorturl, referrer, user_agent, ip_address, country_code) VALUES (:now, :keyword, :referrer, :ua, :ip, :location)", $binds );
    } catch (Exception $e) {
        $result = 0;
    }

    return $result;
}

And yes, I may have "hacked" a core file, so if you know how I can instead do this with a plugin, please let me know. Any help would be greatly appreciated!