Kris

createImageBitmap が利用できない?プラットフォーム別・環境別のトラブルシューティング

トラブルシューティングブラウザ互換性createImageBitmap

発生する症状

Any3D が「現在のブラウザは createImageBitmap をサポートしていません」と表示します。これは Worker パスの3点セットの1つで、バックグラウンドで画像ピクセルを効率的にデコードするために使用されます。これがないと、テクスチャ圧縮や画像から3Dモデルへの変換などの処理が完全な Worker パスを実行できず、大きなファイルでは処理が遅延しやすくなります。

よくある原因

原因典型的なシナリオ
ブラウザ/WebView が古い古い Android WebView、アプリ内蔵ページ
非セキュアコンテキストHTTP サイト(localhost 以外)、file://
クロスオリジンリソース設定不備企業 CDN/CORS が原因で画像デコード失敗(機能異常として現れる)
メモリ/タブ制限モバイル低メモリ端末、企業の「シングルタブ」ポリシー
拡張機能による干渉プライバシープラグインが Image API の動作を変更

プラットフォーム別の調査手順

Windows / macOS(デスクトップ)

  1. Chrome / Edge / Firefox / Safari の最新安定版を使用します。
  2. Any3D は必ず HTTPS で開いてください。
  3. macOS のスクリーンタイムWindows ファミリー セーフティがダウンロードやメディアアクセスを制限していると、大きな画像のデコードに影響する可能性があります。管理者アカウントでテストしてください。
  4. リモートデスクトップ:非常に高解像度のテクスチャは GPU 環境が弱いとデコードに失敗する場合があります。最初に小さな画像で検証してください。

Linux

  1. Chrome / Firefox を更新します。Wayland で GPU デコードに異常がある場合は、X11 セッションと比較してみてください(まれです)。

iOS / iPadOS

  1. Safari 14+ からサポートが良好です。iOS のシステムアップデートを維持してください。
  2. LINE 内蔵ブラウザのエンジンは古くなりがちです → Safari で開いてください
  3. iCloud プライベートリレー / 成人向けコンテンツ制限は通常 createImageBitmap をブロックしませんが、クロスオリジンの画像ホスティングはブロックする可能性があります。モデルのテクスチャが同一オリジンかアクセス可能であることを確認してください。

Android

  1. ChromeAndroid System WebView を更新します(設定 → アプリ → システムアプリを表示)。
  2. 特定ベンダーブラウザの互換モード → Chrome に切り替えてください。
  3. デジタルウェルビーイング / Family Link がバックグラウンドアクティビティを制限しても API には直接影響しませんが、大きなファイルのアップロードを妨げる可能性があります。

ネットワーク、VPN、企業内ネットワーク

シナリオ説明
会社の VPNモデルのテクスチャが内網 CDN 経由の場合、CORS や証明書エラーで decode が失敗する可能性があります。Console にネットワークエラーが出ます
透過プロキシ画像レスポンスが置換・破損されていると、createImageBitmap が reject される可能性があります
内網が HTTP のみ非セキュアコンテキストのため、API が利用できないか動作が制限されます
ゼロトラスト / SSL インスペクション自己署名証明書を信頼ストアにインポートする必要があります。そうしないとリソース読み込みに失敗します

推奨:VPN を切断し、テザリングに切り替えて、外部テクスチャのない純粋なジオメトリモデルをアップロードしてテストしてください。純粋なジオメトリが正常でテクスチャ付きが失敗する場合は、ネットワーク / CORS を優先的に調査してください。

企業ポリシーとペアレンタルコントロール

  • Intune App Protection は「名前を付けて保存 / ダウンロード」を制限する場合があり、ユーザーの画像選択フローに間接的に影響しますが、API 自体は存在するはずです。Console で自己テストして切り分けてください。
  • 学校の iPad 管理:「ファイル」App が禁止されている場合、API には影響しませんが、アップロード方法に影響します。サポートされているアップロード経路を使用してください。
  • ルーターのペアレンタルコントロール DNS:Any3D のドメインをブロックすると、createImageBitmap だけではなくサイト全体が利用できなくなります。

段階的な修正(共通)

  1. HTTPS + 最新ブラウザ + 再起動。
  2. シークレットウィンドウで拡張機能を除外。
  3. アプリ内 WebView ではなく、システムブラウザで開く。
  4. Web WorkerOffscreenCanvas も警告されていないか併せて確認します。

クイックセルフテスト

typeof createImageBitmap !== "undefined";

上級(HTTPS とアクセス可能な画像 URL が必要):

fetch("https://example.com/favicon.ico")
  .then((r) => r.blob())
  .then((b) => createImageBitmap(b))
  .then(() => console.log("ok"))
  .catch(console.error);

まとめ

createImageBitmap の問題は、古い WebView、非 HTTPS、VPN/内網によるリソース読み込み失敗が原因であることがほとんどです。プラットフォームに応じて WebView を更新し、ネットワークを変えて検証し、拡張機能を除外すれば、Worker 画像処理パスは通常復旧します。

応援する