birdofpreyru/react-native-static-server

Not loading the pages/files

1-AlenToma opened this issue · 11 comments

Hi, so after to much work I was able to install and lunch this lib.

Now the issue is I am not able to display the html page I have in assets folder.

I am getting website cannot be reach when I navigate to http://127.0.0.1:7777/public/index.html

I am using this in react-native-windows

I made sure that the files exist in assets, as Could see it in fileDir

Here is my code for the useServer hook

import React, {useState, useEffect} from "react";
import Server from '@dr.pogodin/react-native-static-server';

export default ()=> {
    const [loading, setLoading] = useState(true);
    const [origin, setOrigin] = useState<undefined | string>();
    const emulatorPath ="/public/index.html";

    useEffect(()=> {
        let server = new Server({
            // See further in the docs how to statically bundle assets into the App,
            // alernatively assets to serve might be created or downloaded during
            // the app's runtime.
            fileDir: 'Assets\\web',
            port:7777,
            errorLog:true,
            stopInBackground:false
          });
          server.addStateListener((newState, details, error) => {
            console.log(
              `New state: "${newState}".\n`,
              `Details: "${details}".`
            );
            if (error) console.error(error);
          });
    
          (async () => {
            // You can do additional async preparations here; e.g. on Android
            // it is a good place to extract bundled assets into an accessible
            // location.
      
            // Note, on unmount this hook resets "server" variable to "undefined",
            // thus if "undefined" the hook has unmounted while we were doing
            // async operations above, and we don't need to launch
            // the server anymore.
            if (server) setOrigin(await server.start());

            setLoading(false);
            console.log(server)
          })();
          return () => {
            setOrigin('');
      
            // No harm to trigger .stop() even if server has not been launched yet.
            server.stop();
      
            server = undefined as any;
          }

    },[])

    return [loading, origin, origin + emulatorPath] as const;
}

I also add the package manafiast rights as descriped in readme.

Do you see anything wrong or is this a bug

If example app from this repo runs for you, then it is not a bug. My bet is you've messed up something with paths. Perhaps you should not use relative fileDir — in v0.7 of this library relative dir path was prepended by document folder like this:

fileDir = `${RNFS.DocumentDirectoryPath}/${fileDir}`;

which, I guess, isn't correct for Windows app.

It is correct as I am getting the full path from console.log(server) there I can see the pathDir which ponts to the application bin dir. There I can see assets and its content.

So the path is right and I am using the latest version of react-native-windows

I assure you the path is right.

So, does the example app work for you? If it does, then it is a problem with your app, not with the library.

The example above start the server dose not navigate and display the content when I put the url in the web browser or WebView

By the example app I mean — the Example App included into this repo.

Aha no I meant my app.

Will download your example and test it also on my PC

I am not able to run your example as o have vs22 installed and I am not able to load the projects.

If I upload my example, will you try and test it ?

Because I am 100% as your example code

If I upload my example, will you try and test it ?

Of course not, why would I do a free work on your project? As far as I am concerned the Example App has been tested on Windows, and it works for me; also I know other guys using the library for their Windows project, and it works for them.

Well with the latest version of windows lib and vs22 it is not working. I'm not good with c++ otherwise I would have looked at it.

Will wait until new people report the same issue, then please try and add referenser to this so I could have a look

trying to build an android version and I am getting an error.

FAILURE: Build failed with an exception.

* What went wrong:
A problem occurred configuring project ':dr.pogodin_react-native-static-server'.
> Failed to notify project evaluation listener.
   > The filename, directory name, or volume label syntax is incorrect

I think that the whole issue is with react-native version I am using.

So will post it here just incase

  "dependencies": {
    "@dr.pogodin/react-native-fs": "^2.21.0-alpha.8",
    "@dr.pogodin/react-native-static-server": "^0.9.0",
    "react": "^18.2.0",
    "react-native": "^0.72.6",
    "react-native-webview": "^13.6.2",
    "react-native-windows": "^0.72.16"
  },