解決 ‘getUserMedia’ of undefined 或是 Chrome 不能錄音問題

今天專案出現了一個問題

TypeError: Cannot read property 'getUserMedia' of undefined

測試情況

可以在測試的時候發現如果使用 http://localhost:9527 會是正常的,可是如使用 http://192.168.1.1:9527 就會出現錯誤,由此可以知道是瀏覽器擋住的

mozilla 文件

我們可以在 getUserMedia 文件看到安全的瀏覽情況是使用

  • https
  • file:///
  • localhost

因此我們直接使用 http://192.168.1.1:9527 是會有問題的

使用 Chrome 參數開啟

那如果要在 Chrome 正常執行有兩個方法

  1. 開啟 Chrome 的時候尾巴帶入參數
--unsafely-treat-insecure-origin-as-secure="http://example.com"
  1. 開啟 chrome://flags 使用 Chrome 參數暫時讓它可以正常執行
chrome://flags/#unsafely-treat-insecure-origin-as-secure

這邊要注意設定完需要重新開啟 Chrome 瀏覽器