blog.unresolved.xyzblog.unresolved.xyz

React NativeのBlobがJSのBlobに準拠していない問題について

Thu Mar 31 2022
  • React Native
  • TIL

TypeError: Network request failed when fetching a file:// uri · Issue #2402 · expo/expo

これはとてもエッジケースではないかという気がしますが、ファイルアップロードなどでBlobが必要になる場面は結構あり、気軽に踏み抜いてしまいました。

ワークアラウンドとしてはコメントに上がっている通りXHRを使ってBlobを取得すればなんとかなります。

const blob = await new Promise((resolve, reject) => {
  const xhr = new XMLHttpRequest();
  xhr.onload = function() {
    resolve(xhr.response);
  };
  xhr.onerror = function() {
    reject(new TypeError('Network request failed'));
  };
  xhr.responseType = 'blob';
  xhr.open('GET', uri, true);
  xhr.send(null);
});

ちなみにCommunityでも議題に上がってはいますが、放置されています。

Fix Blob Compatibility · Issue #109 · react-native-community/discussions-and-proposals