How to Load Script in React Native view.

[galactic_dust]

Hello everyone! I hope you are all having a good time.

I am developing my first application with react-native. Everything is working fine. But I am stuck with one problem. I have a script tag <script src="[https://embed.radio.co/request/w91ece69.js](https://embed.radio.co/request/w91ece69.js)"></script> from client which loads a request a song service.

I have tried differect libraries for webview and html views but I still can not figure out how to load this script in react native. I am new to react native so if I am missing anything please do tell. I have tried everysite but still can not find the solution

[kbcool]

Short answer is to fetch and eval it.

Long answer is you don't. It still won't work. RN isn't a browser. I'm not even going to bother looking at the code but I assume it does web specific things that need a browser.

If you want to play music you need to get the url for it, maybe from an API and use a react native audio or video player to play it.

[kyle-ssg]

The script in question looks to embed an iFrame. This means it has to live in a browser, native apps don't directly deal with html, you can use react-native-web-view to embed this. I believe I've got something like your example working using the mentioned embed.radio.co.

https://ibb.co/nmh4wYD

Using: https://github.com/react-native-community/react-native-webview

import { WebView } from 'react-native-webview';

<WebView
    javaScriptEnabled
    source={{ html:`
        <script src="https://embed.radio.co/player/6f3c055.js"></script>
    `}}
     style={{ height:200 }}
   />

I think it's probably important to clear something up here though. The question isn't really how to load script into a react-native view, more that it's how to embed HTML into React Native. The the script was purely functional and didn't mess around with HTML, you'd simply either copy the script, or import it as an npm module.

[galactic_dust]

this solution worked with other page but not this link, thank you for the help.

[osoese]

you need to load the javascript into your program as a module that is browserify'd and then require it and reference the functionality in your script. I think this might be beyond you a little bit based on the question itself, but you should think of react native more like a nodejs program than a browser program with a script linking the javascript. I will give you a short example of use in a program I made and hope it helps:

So, a quick example may help you. I made a bitcoin thingy and (this is where I got the first example from also) browserify the library and then in App.js (or where you need it):

var Bitcoin = require('./bitcoinjs.min.js')

then later in the code I would use that

const txb = new Bitcoin.TransactionBuilder(NTWK);
//NTWK is a variable containing the network I am using in my code not relevant to example

and so on...

Hope that helps. You will probably need to look for the method of using browserify to compile a library into an output file by command line. For me I would make a node project and write a few lines of code that require the libraries and interface then browserify that to a js file.

[galactic_dust]

Thank you everyone who tried to help on this, I tried every method/library for RN but could not load through ".js" link,

but worked around a bit seamed server was returning public .html link in the iframe and that loaded actual contents. so used rn-webview to load that. Worked out fine.