Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Exception in HostFunction: Malformed calls from JS: field sizes are different

See original GitHub issue

I’m trying to upload a JPEG image using react-native-image-picker which returns me a URI. When I call RNFetchBlob.fetch() it returns this error

Error

Error: Exception in HostFunction: Malformed calls from JS: field sizes are different. [[16,16,16,16,16,16,16,16,16,16,16,16,16,16,16,16,16,16,16,28,18],[5,4,5,4,4,4,4,4,7,8,8,8,8,8,9,8,9,9,3,11,0],[[673,{"style":{"transform":430,"right":655,"opacity":271},"type":"style"}],[271,673],[655,{"input":[270,20],"op":"multiply","type":"op"}],[270,655],[20,655],[655,673],[430,673],[673,674],[654,277],[653,654],[271,653],[635,653],[270,635],[20,635],[635],[430,653],[653],[654],[674,277],[187,100,1588864064469,false]],3220]

Code / Redux Saga

function* updateAvatar({ payload }) {
    if (!payload) {
      yield call(api.delete, '/avatar');
      yield put(updateAvatarSuccess());
      return;
    }

    const response = yield call(
      RNFetchBlob.fetch,
      'POST',
      `${config.api}/avatar`,
      {
        'Content-Type': 'multipart/form-data',
        ...api.defaults.headers,
      },
      [
        {
          name: 'file',
          filename: 'avatar.jpg',
          type: 'image/jpeg',
          data: RNFetchBlob.wrap(payload.uri),
        },
      ]
    );

    yield put(updateAvatarSuccess(response.json().avatar));

I can’t upload files using new FormData() passing { name: ..., uri: ... } as many tutorials says, I must send a binary file as this lib does. Thank you.

Issue Analytics

State:
Created 3 years ago
Reactions:8
Comments:5

Top GitHub Comments

6reactions

leonardoMoliveiracommented, Jun 1, 2020

I figure out this happens only using yield call() of Redux Saga

the solution for me was:

    const response = yield call(() => {
      return new Promise((resolve, reject) => {
        RNFetchBlob.fetch(
          'POST',
          `${config.api}/avatar`,
          {
            ...api.defaults.headers,
            'Content-Type': 'multipart/form-data',
          },
          [
            {
              name: 'file',
              filename: 'avatar.jpg',
              data: payload,
            },
          ]
        )
          .then(resolve)
          .catch(reject);
      });
    });

someone know why this happens?

1reaction

etsraphaelcommented, Jun 1, 2020

Same issue on android