Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Android: how to serve statics from assets folder? #23

Closed
naltimari opened this issue Nov 28, 2017 · 7 comments
Closed

Android: how to serve statics from assets folder? #23

naltimari opened this issue Nov 28, 2017 · 7 comments

Comments

@naltimari
Copy link

naltimari commented Nov 28, 2017

I did some tests and right now there's no way to point the StaticServer to a 'www_root' on the assets folder on Android. I think storing the static files as assets is a straightforward way, but I couldn't find a way to make it work.

Any ideas?

p.s. RNFS.DocumentDirectoryPath is not where the assets are stored

@Taffyw
Copy link

Taffyw commented Dec 21, 2017

me too do you success?

@jishuke
Copy link

jishuke commented Jan 8, 2018

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
Copy link

jishuke commented Jan 8, 2018

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

@naltimari
Copy link
Author

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
Copy link

Duplicate issue here - #6

Anyone find a solution? For both android and ios?

@kanalasumant
Copy link

kanalasumant commented Mar 5, 2018

@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
Copy link
Contributor

fchasen commented Mar 20, 2018

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

@fchasen fchasen closed this as completed Mar 20, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants