本地存储中的 React-native-WebView setItem() 不起作用

问题描述 投票:0回答:1

我想在 React Native 应用程序中打开的页面需要检查

localStorage
,它存储
user token
user roles
user permissions
。因此,需要在加载页面之前在
localStorage
中设置token和其他相关值。

我在

injectedJavaScriptBeforeContentLoaded
中使用了
react-native-webview
道具,但没有用。

这是我的代码

const runFirst = `
      window.localStorage.setItem('api_token', 'zzz');
      window.localStorage.setItem('auth_roles', 'zzz');
      window.localStorage.setItem('auth_permissions', 'zzz');
      setTimeout(function() { window.alert('hi') }, 1000);
      true; // note: this is required, or you'll sometimes get silent failures
    `;

    return (
        <NativeBaseProvider>
            <WebView
                startInLoadingState={true}
                source={{
                    //uri: 'https://github.com/react-native-webview/react-native-webview',
                    uri:'xxxxxx'
                }}
                injectedJavaScriptBeforeContentLoaded={runFirst}
                onMessage={(event) => {}}
                style={{width:screenWidth, height:screenHeight}}
            />
        </NativeBaseProvider>
    );

代码

setTimeout(function() { window.alert('hi') }, 1000);

将被执行,但是

window.localStorage.setItem

没有被执行。

打开的页面是空白的。

如果我把

window.localSotrage.setItem
的代码去掉,页面就可以正常打开了

设备:三星 Galaxy A34 5G
操作系统:安卓
操作系统版本:安卓9
反应本机版本:0.71.13
反应本机网页视图版本:13.6.2

我已经尝试阅读有关React-Native-WebView注入JavaScriptBeforeContentLoaded的资源:

我正在寻找一些解决方案或帮助

react-native local-storage react-native-webview
1个回答
0
投票

您是否尝试过等待文档加载后再访问本地存储?

window.onload = function(){
  window.localStorage.setItem('api_token', 'zzz');
  window.localStorage.setItem('auth_roles', 'zzz');
  window.localStorage.setItem('auth_permissions', 'zzz');
  setTimeout(function() { window.alert('hi') }, 1000);
}

也许警报起作用是因为超时。

© www.soinside.com 2019 - 2024. All rights reserved.