The server is always serving the assets from the folder it was started the first time

[medmo7]

Im using this library to serve assets to use with a local webSite on WebView.

The assets are book images, so when the user choose a book in the library I start the local server in the folder containing the assets of the chosen book.

The issue is that the WebView is always loading the first chosen book.

Here is my WebView code:

export default function WebApp(props) {
    const { fs } = RNFetchBlob;
    const dirs = RNFetchBlob.fs.dirs
    const storedBooks: StoredBook[] = useSelector(state => state.storedBooks)
    const [ebook, setEbook] = React.useState<StoredBook>(null)
    const [loading, setLoading] = React.useState(false)
    const [serverUrl, setServerUrl] = React.useState(null)
    const [readerUrl, setReaderUrl] = React.useState(null)

    React.useEffect(() => {
        setLoading(true);
        initBookReader()
        StatusBar.setHidden(true)

        return () => {
            if (bookServer && bookServer.isRunning()) {
                console.log('unmounting static server')
                bookServer.stop();
                bookServer = null
            }
            StatusBar.setHidden(false)
        }
    }, [])

    const initBookReader = () => {
        const bookId = props.route.params.bookId;
        const bookToLoad = storedBooks.find(book => book.data.id === bookId)
        if (bookToLoad) {
            setEbook(bookToLoad);
            startStaticServer(bookToLoad.assetsPath, bookToLoad.data.id);
        } else {
            setLoading(false);
            Alert.alert('Loading error', 'An Error happened while loading ebook', [
                {
                    text: 'back',
                    onPress: props.navigation.goBack()
                }
            ])
        }
    }

    const startStaticServer = async (bookPath: string, bookId: number) => {
      
        let folderPath
        if (Platform.OS === 'ios') {
            folderPath = `${dirs.DocumentDir}/books/${bookId}`
        } else {
            folderPath = bookPath
        }
        console.log('folderPath', folderPath)
        bookServer = new StaticServer(8080, folderPath, { localOnly: true, keepAlive : true });
        bookServer.start().then(url => {
            setServerUrl(url);
            console.log('url', url)
        }).catch(error => {
            console.log('error in starting server', error);
            Alert.alert('Loading error', 'An Error happened while loading ebook', [
                {
                    text: 'back',
                    onPress: props.navigation.goBack()
                }
            ])
        }).finally(() => setLoading(false))

    }


 


    const handleGoToLibrary = event => {
        if (event.nativeEvent.data === 'back') {
            props.navigation.goBack();
        }
    }




    const sourceUri = Platform.OS === 'android'
        ? 'file:///android_asset/Web.bundle/index.html'
        : 'Web.bundle/index.html';
    return <WebView
        scalesPageToFit
        javaScriptEnabled={true}
        injectedJavaScriptForMainFrameOnly={false}
        // scrollEnabled={false}
        bounces={false}
        messagingEnabled={true}
        // injectedJavaScriptBeforeContentLoaded={myScript}
        originWhitelist={['*']}
        source={{ uri: loading ? undefined : sourceUri }}
        allowFileAccess={true}
        javaScriptEnabledAndroid={true}
        renderLoading={() => <ActivityIndicator size="large" color={colors.orange} />}
        onMessage={handleGoToLibrary}
        cacheEnabled={false}
    // onLoad={() => setLoading(false)}
    // onNavigationStateChange={(state) => console.log('navigationState', state)}
    />;

    // }
}

Thanks a lot

[lunarraid]

Has anyone else seen this? I'm running into the same issue on my end. I'm using react-native-codepush to download new directories to serve from, but the server is still serving from the older code push directory, despite explicitly specifying the new one per platform.