从 React Native iOS 应用程序查询 Flask 资源时出现 Axios.network 错误（无效的 imageTag）

Question

I have a Flask app set up with a few endpoints. These endpoints work fine when accessed from postman or a browser.

I also have a React Native app set up (using an Expo template), in which I try to query this resource from iOS:

const testApiCall = async (): Promise<string> => {
  try {
    const url = `${baseUrl}/users`;
    const response = await axios.get(url);
    console.log(response.data);
    return response.data.toString();
  } catch (error) {
    console.log(error.request)
    console.log(" a " + error.request?._response);
    console.log(error);
  }
}

baseUrl is the full IP, not just localhost .

The /users endpoint returns json of the app's users. However, when calling this, I get the following output:

a Invalid imageTag: 192.168.1.191:80/users
[AxiosError: Network Error]

(excluding the error.request since it's long and probably doesn't provide any additional context - will edit this post if it would be useful!)

I can't find any reason for the "invalid imageTag" error. Intermittently, the flask app will get logs including a 404 request for the favicon:

[06/May/2022 21:55:05] "GET /users HTTP/1.1" 200 -
[06/May/2022 21:55:05] "GET /favicon.ico HTTP/1.1" 404 -
[06/May/2022 21:56:15] "GET /users HTTP/1.1" 200 -
[06/May/2022 21:56:16] "GET /favicon.ico HTTP/1.1" 404 -

I even tried to make an endpoint in the flask app to return a generic.ico file when requesting /favicon.ico but behavior didn't change. Now, I stopped getting any kind of request on my flask app when using my React Native app. I still get logs when accessing the endpoints from postman, though.

I also used flask_cors :

CORS(app, resources={r'/*': {'origins': '*'}})

This one has been a real head-scratcher for me and I'm having trouble finding any similar issues, so I'd really appreciate any help, Happy to provide additional context that could be useful. too.

A request to https://jsonplaceholder.typicode.com/todos/1 worked without an issue. Tried with http:// and that worked too.

Added this to app.json but it didn't help:

"ios": {
      "supportsTablet": true,
      "infoPlist": {
        "NSAppTransportSecurity" : {
          "NSAllowsArbitraryLoads" : true,
          "NSAllowsLocalNetworking": true
        }
      }
    },

Answer 1

Turns out my logic for getting the baseUrl excluded the http:// . Prepending the baseUrl with 'http://' solved the issue. It's always something obvious that I miss!