如何通过chrome.system.display.setDisplayProperties调整Chrome OS分辨率？

Got it, let's fix that annoying resolution revert issue in your Chrome OS digital signage kiosk. The chrome.system.display API is perfect for this—here's a solid implementation to lock in your desired 1920x1080 resolution and stop those unexpected drops to 720p.

1. First, Update Your App Manifest #

Your kiosk app needs explicit permission to modify display settings. Add the system.display permission and confirm kiosk mode is enabled in your manifest.json (we'll use Manifest V3, the recommended standard for Chrome OS):

{
  "name": "Digital Signage Kiosk",
  "version": "1.0.0",
  "manifest_version": 3,
  "kiosk_enabled": true,
  "permissions": ["system.display"],
  "background": {
    "service_worker": "background.js"
  },
  "icons": {
    "128": "signage-icon.png"
  }
}

Make sure you deploy this updated manifest to your Chrome OS devices via your enterprise management console—permissions won't take effect otherwise.

2. Detect Current Display & Check Resolution #

In your background service worker (background.js), start by fetching display info to identify the target screen (most signage setups use a single primary display):

// Run on app startup
chrome.runtime.onStartup.addListener(() => {
  checkAndSetResolution();
});

// Check current resolution and reset if needed
function checkAndSetResolution() {
  chrome.system.display.getInfo((displays) => {
    // Target the primary display (first entry in most cases)
    const primaryDisplay = displays.find(display => display.isPrimary) || displays[0];
    const currentRes = primaryDisplay.bounds;

    // Verify if we're already at 1920x1080
    if (currentRes.width !== 1920 || currentRes.height !== 1080) {
      console.log(`Current resolution ${currentRes.width}x${currentRes.height} doesn't match target—resetting...`);
      setTargetResolution(primaryDisplay.id);
    } else {
      console.log("Resolution is already locked to 1920x1080");
      // Start monitoring for unexpected changes
      monitorDisplayChanges();
    }
  });
}

3. Set & Lock the Target Resolution #

Use chrome.system.display.setDisplayProperties to enforce your desired resolution, and add a listener to catch any unexpected changes (like Chrome OS reverting to 720p):

function setTargetResolution(displayId) {
  const targetSettings = {
    bounds: {
      width: 1920,
      height: 1080
    },
    // Optional: Fix overscan if your TV crops content (adjust values as needed)
    overscanCorrection: {
      left: 0,
      top: 0,
      right: 0,
      bottom: 0
    },
    isPrimary: true
  };

  chrome.system.display.setDisplayProperties(displayId, targetSettings, (error) => {
    if (error) {
      console.error(`Failed to set resolution: ${error.message}`);
      // Retry after a short delay if needed
      setTimeout(() => setTargetResolution(displayId), 2000);
    } else {
      console.log("Successfully set resolution to 1920x1080");
      monitorDisplayChanges();
    }
  });
}

// Watch for display configuration changes and re-lock resolution if needed
function monitorDisplayChanges() {
  chrome.system.display.onDisplayChanged.addListener(() => {
    console.log("Display configuration changed—verifying resolution...");
    checkAndSetResolution();
  });
}

4. Critical Notes for Reliability #

• Verify Supported Modes: Before hardcoding 1920x1080, check primaryDisplay.supportedDisplayModes to confirm your TV actually supports this resolution. Avoid setting unsupported modes—this will cause the API to fail.
• Enterprise Permissions: Ensure your organization's Chrome OS management policy allows kiosk apps to access the system.display API. Double-check this in your Google Admin Console under Device Management > Chrome > Apps & extensions > Kiosks.
• TV Settings: Disable any "auto-resolution" or "dynamic scaling" features on your TV. These can override Chrome OS's settings even with the API in place. Look for options like "Just Scan" or "1:1 Pixel Mapping" to disable overscan.

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