Network Error React Native

[stephanoparaskeva]

// Results in Network Error --- (This exact request works fine on Node)

    const handleText = async (str?: string) => {
    const search = new Client({
      nodes: [{ host: 'localhost', port: 8108, protocol: 'http' }],
      apiKey: API_KEY,
    });

    let searchParameters = { q: str, query_by: 'title', };

    const res = await search
      .collections('roles')
      .documents()
      .search(searchParameters);
    setTerm(str || '');
}

// Works fine

const handleText = async (str?: string) => {
    setTerm(str || '');
    try {
      const res = await axios({
        url: `http://localhost:8108/collections/roles/documents/search?q=${
          str || '*'
        }&query_by=title&per_page=200`,
        method: 'get',
        headers: { 'X-TYPESENSE-API-KEY': API_KEY },
      });

      console.log({ ...res.data, hits: res?.data?.hits?.[0] });
      setHits(res?.data?.hits);
    } catch (err) {
      console.warn(err);
    }
  };

// Error

// Tried this with both Client and SearchClient

React Native Version 0.62 IOS, TypeSense 0.6.0

[jasonbosco]

@stephanoparaskeva It's interesting that it works with axios directly. We do add additional request options to axios, so I'm wondering if one these causes an issue in a React Native environment: https://github.com/typesense/typesense-js/blob/a1def5f9faa30c64b0732dc0bb7ea5120e7e9144/src/Typesense/ApiCall.js#L54-L77

To help debug this, could you try two things:

1. Change localhost to an IP address. This seems to suggest that this could be a potential issue, although I'm not too hopeful that this is the solution since your direct axios request seems to work fine.

2. Could you add the request options from above to your direct axios call and see if any of those cause the issue?

[stephanoparaskeva]

@stephanoparaskeva It's interesting that it works with axios directly. We do add additional request options to axios, so I'm wondering if one these causes an issue in a React Native environment:

https://github.com/typesense/typesense-js/blob/a1def5f9faa30c64b0732dc0bb7ea5120e7e9144/src/Typesense/ApiCall.js#L54-L77

To help debug this, could you try two things:

1. Change localhost to an IP address. This seems to suggest that this could be a potential issue, although I'm not too hopeful that this is the solution since your direct axios request seems to work fine.
2. Could you add the request options from above to your direct axios call and see if any of those cause the issue?

It's the data: {} that you're sending, via Axios for GET in React Native as this threw an error for me. When I was making my axios queries to figure out a temporary alternative for typesense-js by using normal requests.

Perhaps you could test with create-react-native-app + typesense + axios GET with a data: {...}?

Maybe a cors error?

[jasonbosco]

@stephanoparaskeva I've now updated the library to not send data for GET requests:

https://github.com/typesense/typesense-js/blob/f7a5c1c99c659cc5a0e59bd0a2b289e753da0eea/src/Typesense/ApiCall.js#L94-L96

Could you give it a shot now in React Native to see if it fixes the issue?

[jasonbosco]

I know at least one user who's using Typesense with React Native, so closing this for now. Please feel free to re-open if this is still an issue.

[itajenglish]

I'm having this same issue on Android specifically. @stephanoparaskeva Were you able to find a solution for this?

[itajenglish]

Update: I was able to get it to connect by running adb reverse tcp:8108 tcp:8108

[walter-ayala]

adb reverse tcp:8108 tcp:8108

Don't work it for me, i'm having the same issue on Android: WARN Request #1703095543420: Request to Node 0 failed due to "undefined Network Error" WARN Request #1703095543420: Sleeping for 0.1s and then retrying request... WARN Request #1703095543420: Request to Node 0 failed due to "undefined Network Error" WARN Request #1703095543420: Sleeping for 0.1s and then retrying request...

[itajenglish]

@walter-ayala I can help if you create a repo showcasing the issue that I can test

[walter-ayala]

@walter-ayala I can help if you create a repo showcasing the issue that I can test

https://github.com/typesense/typesense-js/issues/189#issuecomment-1865244280 basically here would be everything related to the code of the project

[hieuplasma]

i met same proplem and cant not resolve, can some one help?