html5怎么判断是否在wifi环境？

You can't reliably detect WiFi specifically with client-side JavaScript in HTML5. There's no API that directly exposes the connection type as "WiFi" vs. "Ethernet" vs. "Cellular". You can only infer the general connection type, which might hint at WiFi but isn't foolproof.

Here's the most common approach, using the Network Information API:

function checkConnection() {
  if (navigator.connection && navigator.connection.type) {
    const type = navigator.connection.type;
    switch (type) {
      case 'wifi':
        console.log('WiFi connection');
        break;
      case 'cellular':
        console.log('Cellular connection');
        break;
      case 'ethernet':
        console.log('Ethernet connection');
        break;
      case 'bluetooth':
        console.log('Bluetooth connection');
        break;
      case 'none':
        console.log('No network connection');
        break;
      default:
        console.log('Unknown connection type');
        break;
    }

    // Effective Type (more general)
    console.log(`Effective connection type: ${navigator.connection.effectiveType}`);
  } else {
    console.log('Network Information API not supported.');
  }
}

checkConnection();

// Listen for changes in connection
if (navigator.connection) {
  navigator.connection.addEventListener('change', checkConnection);
}

Explanation:

• navigator.connection.type: This returns the connection type. While it can return wifi, it's not consistently implemented across browsers and devices, and might be inaccurate. A tethered computer connected via USB might show as ethernet even if the tether is using WiFi.

• navigator.connection.effectiveType: This is often more useful. It provides a general categorization of connection speed (e.g., '4g', '3g', '2g', 'slow-2g'). You could use this to infer that a '4g' connection is likely cellular, and anything else might be WiFi or Ethernet. However, this is not a guarantee. A fast ethernet connection might also be reported as '4g'.

• navigator.connection.addEventListener('change', checkConnection): This allows you to detect changes in the connection type.

Key Limitations:

• No WiFi Guarantee: You can't be 100% certain it's WiFi.
• Browser Compatibility: The Network Information API isn't universally supported. Check caniuse.com for the latest compatibility data.
• User Privacy: Be mindful of user privacy. Don't make assumptions about user behavior based solely on the connection type.

In Summary: While you can get hints, there's no definitive way to detect a WiFi connection specifically using client-side JavaScript. The provided code gives you the best tools available, but remember the limitations. If precise WiFi detection is critical, you might need to explore server-side solutions.