如何使用JavaScript将本地文件（非网络链接）投屏至Chromecast

你的判断完全正确。Chromecast是独立接入局域网的网络设备，调用play()方法时仅会将传入的资源URL发送给设备端，由设备主动发起HTTP请求拉取媒体流，既无法访问你本机的文件系统，也不支持file://协议的资源加载，因此本地文件路径必然会加载失败。

可行的实现方案有两种，都不需要依赖第三方公网服务：

方案1：本地启动HTTP静态服务（最简单，原生支持字幕加载） #

这是最稳定、实现成本最低的方案，核心逻辑是在你运行程序的本机启动一个对局域网开放的HTTP静态服务，将存放视频、字幕的本地目录映射为HTTP可访问的路径，再把拼接好的局域网URL传给Chromecast即可。

• 静态服务必须监听0.0.0.0地址，不能绑定127.0.0.1，否则局域网内的Chromecast无法访问
• 提前获取你本机在当前局域网下的IPv4地址（通常为192.168.x.x段），最终传给Chromecast的媒体地址格式为http://[你的局域网IP]:[服务端口]/[文件名]
• chromecast-api原生支持传入字幕参数，只要字幕文件也在静态服务的映射目录下，就可以直接被Chromecast加载，不需要额外处理

实现代码示例（需要先安装依赖npm i chromecast-api ecstatic）：

const ChromecastAPI = require('chromecast-api')
const http = require('http')
const ecstatic = require('ecstatic')
const os = require('os')
const path = require('path')

// 配置参数
const CONFIG = {
  mediaDir: 'E:/Download/Movies/Curb.Your.Enthusiasm.S11E02.1080p.WEB.H264-GGWP[TGx]/',
  mediaFile: 'curb.your.enthusiasm.s11e02.1080p.web.h264-ggwp.mp4',
  subtitleFile: 'curb.your.enthusiasm.s11e02.1080p.web.h264-ggwp.srt',
  targetDevice: 'S70PCI',
  port: 8787 // 选择未被占用的本地端口即可
}

// 获取本机局域网IPv4地址
const getLocalIP = () => {
  const interfaces = os.networkInterfaces()
  for (const ifaceGroup of Object.values(interfaces)) {
    for (const iface of ifaceGroup) {
      if (iface.family === 'IPv4' && !iface.internal) return iface.address
    }
  }
  return '127.0.0.1'
}
const localIP = getLocalIP()

// 启动局域网静态服务
const server = http.createServer(ecstatic({ root: path.resolve(CONFIG.mediaDir) }))
server.listen(CONFIG.port, '0.0.0.0', () => {
  console.log(`静态服务已启动，根地址：http://${localIP}:${CONFIG.port}`)

  const client = new ChromecastAPI()
  client.on('device', (device) => {
    if (device.friendlyName !== CONFIG.targetDevice) return
    const mediaUrl = `http://${localIP}:${CONFIG.port}/${CONFIG.mediaFile}`
    const subtitleUrl = `http://${localIP}:${CONFIG.port}/${CONFIG.subtitleFile}`
    
    console.log(`正在向设备${device.friendlyName}发起播放请求`)
    device.play(mediaUrl, {
      subtitles: [{ url: subtitleUrl, language: 'zh-CN', name: '中文字幕' }]
    }, (err) => {
      if (err) {
        console.log('播放失败：', err)
        server.close()
        return
      }
      console.log('播放已开始')
    })
  })
})

使用时注意三个坑：

• 提前在系统防火墙放开你配置的服务端口，否则Chromecast的请求会被拦截
• 视频、字幕文件名尽量不要带中文、特殊符号、空格，避免URL编码问题导致加载失败
• 播放过程中不要让电脑休眠、不要退出程序，否则静态服务中断后Chromecast无法继续拉流

方案2：自定义HTTP服务按需推流（灵活性更高） #

如果不想直接暴露整个媒体目录，可以自己实现轻量HTTP服务，在收到Chromecast的请求时，直接将本地文件的读取流通过响应返回给设备，本质还是HTTP传输，只是可以自定义权限校验、路径映射逻辑。如果遇到Chromecast不支持的视频编码格式，还可以在这个环节接入ffmpeg做实时转码，转成Chromecast兼容的H264+AAC编码流再返回，兼容性更强。这种方案代码复杂度更高，适合有定制需求的场景。

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