<bdo id="4g88a"><xmp id="4g88a">
  • <legend id="4g88a"><code id="4g88a"></code></legend>

    electron 下網頁獲取 micphone 權限

    網頁獲取麥克風或攝像頭權限我們只需調用 navigator.mediaDevices.getUserMedia 方法就可喚起瀏覽器用戶授權

    const useMicphone = async () => {
      try{
        let mediaStream = await navigator.mediaDevices.getUserMedia({ audio: true });
        if (mediaStream) {
          console.log('獲取 micphone 成功')
        }
      }catch(e){  
        console.warn('獲取 micphone 失敗')
      }
    };
    

    但在 electron 內可能不起作用

    我們用 electron 來包裹網頁本意大多就是為了方便獲取更多的操作權限

    如果獲取失敗的話可嘗試在 electron 內提前讓用戶權限可在 electron 提供的 api 內在用戶打開軟件時提前授權

    在創建窗體后,加載網頁前調用 systemPreferences.getMediaAccessStatus 授權:

    import { app, systemPreferences } from "electron";
    
    // 權限授權
    async function checkMediaAccess(mediaType: 'microphone' | 'camera' | 'screen'){
      const result = systemPreferences.getMediaAccessStatus(mediaType)
      if(result !== "granted"){
        await systemPreferences.askForMediaAccess('microphone')
      }
    }
    
    // 創建主窗體
    async function createMainWindow() {
      const win = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
          nodeIntegration: true,
          preload: path.join(__dirname, "preload.js"),
          webSecurity: false,
        },
      });
      // 此處調用并授權
      await checkMediaAccess('microphone')
    
      if (isDev) {
        win.loadURL(VITE_DEV_SERVER_URL);
        win.webContents.openDevTools();
      } else {
        win.loadFile('dist/index.html')
      }
      return win;
    }
    

    如果獲取 micphone 或者攝像頭是在 electron 網頁內再嵌入的 iframe 內則還需要在 iframe 上加上 allow 屬性:

    // 允許地理信息,麥克風,攝像頭.. 等權限
    <iframe allow="geolocation; microphone; camera; midi; encrypted-media;" src="http://helloworld.com" style="min-width: 100%; height: 100%; width: 100%;"></iframe>
    

    注:轉載請注明出處博客園:王二狗Sheldon池中物 (willian12345@126.com)

    posted @ 2024-02-19 16:13  池中物王二狗  閱讀(42)  評論(0編輯  收藏  舉報
    轉載入注明博客園 王二狗Sheldon Email: willian12345@126.com https://github.com/willian12345
    免费视频精品一区二区_日韩一区二区三区精品_aaa在线观看免费完整版_世界一级真人片
    <bdo id="4g88a"><xmp id="4g88a">
  • <legend id="4g88a"><code id="4g88a"></code></legend>