Akila

Akila

  • NA
  • 216
  • 29.6k

How to Pass data to WebView from React Native

Feb 11 2022 11:37 AM

Hi,

I am using webview for get method.there is lot of pass data method.but how can i display data from api  webview to native.

accesstoken is only on native.if i create api and disply record in webview how can i pass accesstoken to webview.

WEBVIEW:

function MobileOceanPage() {

    const [filteredDataSource, setFilteredDataSource] = useState([]);    

 useEffect(async()=> {       

         axios

          .get(url, {

            headers: {

              Authorization: `bearer  ${accesstoken}`,//how can i pass accesstoken from native here    

            },

          })

          .then(({ data }) => {

           setFilteredDataSource(data);

               });    

      },[]

 )

 

    return(

        <body>

            <p style={{textAlign:'center'}}>with token</p>

            <input  style={{ display: 'block',

             margin : '0 auto'}} id='profile' type="text"></input>

               <p style={{textAlign:'center'}} id='test'></p>

            {filteredDataSource.map(item=>

        <div>

        <div className="profile">

        <img src={item.file_name}/>

        </div>

        

        <div className="profile_Name">

        <p>{item.profile_name}</p>

        </div>

        

        <p className="profile-title">{item.upload_title}</p>

        <img className="profile-upload-img" src={item.profile_imagePath}/>

            </div>

        )}

 

        </body>

    );

}

 

NATIVE CODE:

function MyWallet(props) {

  const webviewRef = React.useRef(null);

 

 

  async function onMessage(data) {

    let accesstoken = JSON.parse(await AsyncStorage.getItem("token")).token;//here only accesstoken pass

    return Alert.alert( '', accesstoken, );

  }

  return (

    <>

      <SafeAreaView style={styles.flexContainer}>

        <WebView

          source={{uri:url  }}

          startInLoadingState={true}

          ref={webviewRef}

          onMessage={onMessage}         

        />

      </SafeAreaView>

    </>

  );

}

The issue is how can i pass this native accesstoken to webview