react-native-fetch-blobでmultipart-formdataをPOSTする

Tomoumi Nishimura 18views 更新:2017年5月31日

react-native-fetch-blobを利用してデータを送るには、

RNFetchBlob.fetch(method, url, headers, [ { name: 'id', data: id }, { name: 'passwd', data: 'passwd' } ])

みたいな感じに、第4引数にname-data構造を持ったデータの配列を渡します。

multipart-formdata形式でバイナリデータを送るには、ヘッダーに、multipart-formdataを表す

'Content-Type': 'application/x-www-form-urlencoded'

を加えた上で、

RNFetchBlob.fetch(method, url, {
  'Content-Type': 'application/x-www-form-urlencoded',
}, [
  { name: 'id', data: id },
  { name: 'passwd', data: 'passwd' }
  { name: 'binarydata', data: RNFetchBlob.wrap(path_to_a_file) }
])

という風に、送付したいデータのパスをRNFetchBlobでラップするか、

base64 = SomeLibrary.convertBinaryToBase64(binaryData);
RNFetchBlob.fetch(method, url, {
  'Content-Type': 'application/x-www-form-urlencoded',
}, [
  { name: 'id', data: id },
  { name: 'passwd', data: 'passwd' }
  { name: 'binarydata', data: base64 }
])

といった感じに、Base64データをdataに指定するという方法を採ります。

参考

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません