Android: how to serve statics from assets folder?

[futurepress]

Android: how to serve statics from assets folder?

[Taffyw]

me too do you success?

[jishuke]

I use this http://10.0.3.15:9000/18.jpg but I can't access the pictures I store, what should I do

[jishuke]

Do I have your success, too? @naltimari @Taffyw @fchasen @frangeris

[naltimari]

I couldnt make it work, but I did some research and it seems Android stores assets in a different way than iOS, so much so that the Android Sdk has an AssetManager class. I’m not sure this can be pulled off without writing a request handler that uses this Api for Android

[Noitidart]

Duplicate issue here - #6

Anyone find a solution? For both android and ios?

[kanalasumant]

@Noitidart This is what I observed on simulators only.

import RNFS from "react-native-fs";
import StaticServer from "react-native-static-server";

const path =
  Platform.OS === "ios"
    ? `${RNFS.DocumentDirectoryPath}/`
    : "/storage/emulated/0/Download/";

let server = new StaticServer(8082, path);
async componentDidMount() {
  const result = await server.start();
}

Appropriate path is set depending on the OS. Tweak the 'DocumentDirectoryPath' or the directory path from where you wanna serve appropriately and the server is run as shown above.
Now for the fun part, when you wanna actually serve a file from 'example' directory which is present directly in the path variable, this seems to work for IOS:

 <WebView
        source={{ uri: `http://localhost:8082/${this.props.path}/index.html` }}
        style={{ flex: 1 }}
        javaScriptEnabled={true}
      />

and for Android,

 <WebView
        source={{ uri: `http://localhost:8082/${this.props.path}` }}
        style={{ flex: 1 }}
        javaScriptEnabled={true}
      />

P.S: On Android, the path hardcoded pretty much should work for almost all real Android devices. I didn't test this functionality on a real IOS device, for lack thereof, but will do that soon and update this comment. Thanks!

[fchasen]

You'll need to copy the files you want to server from the assets folder to the RNFS.DocumentDirectoryPath using RNFS.copyFileAssets : https://github.com/itinance/react-native-fs#copyfileassetsfilepath-string-destpath-string-promisevoid