React Native returns.network error when calling asp.net api

Question

I am trying to call my asp.net api from react native but it always returns a.network error. I have configured my api cors policy to accept all origins, all methods and all headers. I am running the react native app on my ios phone using expo, I configured the url to https as I have read ios blocks http requests by default. I tried using localhost:{port} as my url and my server's ip address and nothing's working. I have been stuck in this issue for 3 days and would appreciate any help.

my c# code:

builder.Services.AddCors(opt =>
            {
                opt.AddPolicy("CorsPolicy", policy =>
                {
                    policy.AllowAnyMethod().AllowAnyHeader().AllowAnyOrigin();
                });
            });

            var app = builder.Build();

            // Configure the HTTP request pipeline.
            if (app.Environment.IsDevelopment())
            {
                app.UseSwagger();
                app.UseSwaggerUI();
            }

            //app.UseHttpsRedirection();
            app.UseCors("CorsPolicy");

            app.UseAuthentication();

            app.UseAuthorization();

            app.MapControllers();

            app.Run();

my get request is a very simple get request for testing purposes

        [AllowAnonymous]
        [HttpGet("Get")]
        public async Task<ActionResult> Get()
        {
            return Ok("test");
        }

my react native code to call the get method:

let getEmployees = () => {
    fetch("https://localhost:7287/get")
      .then((res) => {
        console.log(res.status);
        console.log(res.headers);
        return res.json();
      })
      .then(
        (result) => {
          console.log(result);
        },
        (error) => {
          console.log(error);
        }
      );
  };

here in my react native code, i'm using localhost but I tried to use my server's ip address as well but still, I get.network request failed.

here's the error i'm getting from react native

Network request failed
at node_modules\whatwg-fetch\dist\fetch.umd.js:541:17 in setTimeout$argument_0
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:214:12 in _allocateCallback$argument_0
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:112:14 in _callTimer
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:357:16 in callTimers
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:417:4 in __callFunction
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:114:6 in __guard$argument_0
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:368:10 in __guard
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:113:4 in callFunctionReturnFlushedQueue

One final thing to note is that all of my api endpoints work perfectly on the browser, postman and swagger. I even tried them on a simple react.js project and they work. Issue only occurs on the react native project. Any help would be massively appreciated.

Answer 1

Can you try with ngrok.io? It'll generate a url which you can use in your application.