Johnny
Johnny

Reputation: 1895

fetch() with relative URL fails on React Native

If I try the below code (React Native app, Expo)

fetch('/public/test.txt').then(function(response) {
     console.log(response);
});

I get a 'Network request failed' error. However, if I prepend the host:port ('http://localhost:3000/public/test.txt') it works just fine. Are relative URLs not supported?

Upvotes: 0

Views: 365

Answers (2)

HSU WAI
HSU WAI

Reputation: 110

In React Native, relative URLs are not supported. The request url must be absolute url. If u want to use only one base url, one way is to create a configuration file, that have 'BASE_URL' variable, eg. 'http://192.168.4.101:3000'. (192.168.4.101 is your computer ip address). After that, import the config file and write something like :

fetch( config.BASE_URL+ '/public/test.txt' )

Upvotes: 2

Johnny
Johnny

Reputation: 1895

I think I got confused :) in a React Native environment there's no notion of "origin host". In my project there happens to be a content server involved, but RN has no way of knowing about it, so the solution is really to configure the host to which the client needs to connect in a given environment (dev, prod).

Upvotes: 0

Related Questions