无需手动设置DevTools断点，从Tampermonkey用户脚本访问网站打包JavaScript内部函数的通用方案问询

Great question! When working with obfuscated or packed JavaScript code on sites like wplace.live, you don’t have to rely on manual DevTools breakpoints to hook into internal variables and functions. Below are several practical, general-purpose methods tailored to your scenario:

1. Monkey-Patching Collection Methods (e.g., Map.set) #

You mentioned seeing code like this.markers.set(k, theVariableINeed)—this is a perfect candidate for monkey-patching. We can override the set method of the Map prototype to intercept when your target variable is stored, then expose it to the global window object.

Here’s a Tampermonkey script example:

// ==UserScript==
// @name         wplace.live Marker Hook
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Hook into internal markers to expose map utilities
// @author       You
// @match        https://wplace.live/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Save the original Map.set method
    const originalSet = Map.prototype.set;

    // Override Map.set to intercept our target variable
    Map.prototype.set = function(key, value) {
        // Adjust this condition based on what you observe in DevTools
        if (this.hasOwnProperty('markers') || key === 'targetMarkerKey') {
            // Expose the value and map instance to window
            window.theVariableINeed = value;
            window.markersMap = this;
        }
        // Call the original method to avoid breaking site functionality
        return originalSet.call(this, key, value);
    };

    // Recreate your PlaceMarker function once we have access to map instances
    window.PlaceMarker = (x, y) => {
        if (window.H && window.T) {
            window.H.setLngLat({ lat: y / 10000, lng: x / 10000 }).addTo(window.T);
        }
    };
})();

2. Intercepting Class Methods (e.g., zv.place) #

If you know the class (like zv) and method (like place) you want to hook into, you can patch the class’s prototype to capture internal variables during method execution. Since packed code uses obfuscated names, you’ll identify the class by its behavior:

// ==UserScript==
// @name         wplace.live zv Class Hook
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Hook into zv.place to expose map utilities
// @author       You
// @match        https://wplace.live/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Hook into object creation to target classes with a `place` method
    const originalObjectCreate = Object.create;
    Object.create = function(proto) {
        if (proto && typeof proto.place === 'function') {
            // Save the original place method
            const originalPlace = proto.place;
            // Override it to capture internal instance data
            proto.place = function(...args) {
                // Expose the instance and its properties to window
                window.zvInstance = this;
                if (this.H) window.H = this.H;
                if (this.T) window.T = this.T;
                // Call the original method to preserve site functionality
                return originalPlace.apply(this, args);
            };
        }
        return originalObjectCreate.call(this, proto);
    };
})();

3. Inject Code Into the Page’s Execution Context #

Tampermonkey scripts run in an isolated context, so sometimes you need to inject code directly into the page’s global scope to access variables locked within local scopes. Do this by creating a <script> element and appending it to the DOM:

// ==UserScript==
// @name         wplace.live Scope Injection
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Inject code to capture internal map variables
// @author       You
// @match        https://wplace.live/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Create a script to run in the page's global context
    const injectScript = document.createElement('script');
    injectScript.textContent = `
        window.addEventListener('load', () => {
            // If the target class is created via a factory function, intercept it
            const originalFactory = window.someFactoryFunction;
            if (originalFactory) {
                window.someFactoryFunction = function(...args) {
                    const instance = originalFactory(...args);
                    // Check if this is our target class instance
                    if (instance.place) {
                        window.zvInstance = instance;
                        window.H = instance.H;
                        window.T = instance.T;
                    }
                    return instance;
                };
            }
        });
    `;
    // Append the script to execute it in the page's context
    document.head.appendChild(injectScript);
})();

4. Programmatic Debugger Statements (Advanced) #

Use a conditional debugger statement to automatically pause execution when your target condition is met, then capture variables without manual setup. This is useful for inspecting variables at specific execution points:

// ==UserScript==
// @name         wplace.live Auto-Debug
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Auto-debug to capture internal variables
// @author       You
// @match        https://wplace.live/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    const injectScript = document.createElement('script');
    injectScript.textContent = `
        // Override console.log to trigger a debugger on target messages
        const originalLog = console.log;
        console.log = function(...args) {
            if (args.some(arg => arg.includes('marker placed'))) {
                // At this point, variables in the local scope are accessible
                // Expose them to window for your Tampermonkey script to use
                window.H = H;
                window.T = T;
            }
            originalLog.apply(this, args);
        };
    `;
    document.head.appendChild(injectScript);
})();

Key Notes: #

• Handle Obfuscation Changes: Packed JS code often updates (e.g., zv might become xy), so periodically re-inspect DevTools to adjust your conditions.
• Preserve Site Functionality: Always call the original method/function after patching to avoid breaking the site.
• Cross-Context Sharing: Use the window object to share variables between injected page code and your Tampermonkey script.

内容的提问来源于stack exchange，提问作者Blob Organic