You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

当href无target定义时,.NET中CefSharp浏览器行为异常求助

Troubleshooting CefSharp JS Injection Issue with Google Maps Markers on websdr.org

Hey there, let's dig into why your CefSharp app is acting up when clicking those Google Maps markers on websdr.org—especially since the top links work fine. Here are the most likely culprits and fixes to try:

1. Google Maps Marker Events Aren't Standard DOM Events

Google Maps doesn't use regular onclick handlers for markers. Instead, it binds events through its own API (google.maps.event.addListener). Your existing JS injection is probably listening for standard DOM click events, which won't fire when a marker is clicked.

Fix: Adjust your script to hook into Google Maps' native event system. For example, if you can access the map instance, you can listen for marker clicks directly:

// Wait for the Google Maps API to load first
function initMapListener() {
  if (window.google?.maps) {
    // Target the specific map instance on websdr.org (adjust selector as needed)
    const map = document.querySelector('#map').map;
    google.maps.event.addListener(map, 'click', function(e) {
      if (e.latLng) {
        // This is a marker click—run your data extraction logic here
        console.log('Marker clicked at:', e.latLng);
      }
    });
  } else {
    setTimeout(initMapListener, 100);
  }
}
initMapListener();

2. Your JS Injection Is Timed Too Early

The Google Maps canvas at the bottom loads asynchronously—way after the main page content. If you inject your script when the main frame finishes loading, the map (and its markers) might not exist yet, so your listeners never attach.

Fix: Delay your injection until the map is fully initialized. Use CefSharp's FrameLoadEnd event, and wait for Google Maps' idle event (which fires when the map is done loading):

browser.FrameLoadEnd += (sender, args) =>
{
    if (args.Frame.IsMain)
    {
        args.Frame.ExecuteScriptAsync(@"
            function waitForMapIdle() {
                if (window.google?.maps) {
                    const map = document.querySelector('#map').map;
                    google.maps.event.addListenerOnce(map, 'idle', function() {
                        // Now inject your data extraction logic here
                        console.log('Map is ready—attaching listeners');
                    });
                } else {
                    setTimeout(waitForMapIdle, 100);
                }
            }
            waitForMapIdle();
        ");
    }
};

3. DOM Structure or Site Updates Broke Your Selectors

It's possible websdr.org updated their page structure or Google Maps version, making your old JS selectors obsolete. For example, the marker elements might have new class names, or the map container ID changed.

Fix: Inspect the map in Chrome DevTools:

  • Right-click a marker and select "Inspect" to see its current DOM structure
  • Check if your script uses outdated selectors (like old class names)
  • Update your script to target the current marker elements or rely on Google Maps' API instead of DOM selectors

4. CefSharp Context Isolation Issues

CefSharp enforces JS context isolation by default. If your injected script runs in the main page context, it might not have access to the Google Maps API's internal context where markers are managed.

Fix: Use CefSharp's RegisterJsObject to create a bridge between your .NET code and the JS context, or ensure your script executes in the same context as the Google Maps code. Alternatively, use ExecuteScriptAsync directly on the frame where the map lives (if it's in an iframe—though websdr's map seems to be in the main frame).

5. Outdated CefSharp Version

Older CefSharp versions might not support newer JS features used by the latest Google Maps API. This could lead to unexpected behavior when interacting with the map.

Fix: Update your CefSharp NuGet package to the latest stable version. Make sure to match the runtime (x86/x64) and .NET version requirements.

Quick Test First!

Before diving into code changes, test your JS script directly in Chrome:

  1. Open websdr.org in Chrome
  2. Open the DevTools Console
  3. Paste your injection script and run it
  4. Click a map marker—if it doesn't work here, the issue is with your script, not CefSharp. Adjust it first before testing in your app.

内容的提问来源于stack exchange,提问作者Oscar Diez

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.22 08:48:41