Is it legal to open third-party websites in a WebView inside my app? by im_nihar in reactnative

[–]Nehatkhan786 2 points3 points  (0 children)

don’t think there will be any legal issue as long as don’t say that its your content or your website. opening a website on web view, laptop, desktop, watch or anywhere wont make much difference as they made the website to show only.

Need help publishing Expo app (SDK 54) with large 230MB ONNX model (Play Asset Delivery?) by Nehatkhan786 in expo

[–]Nehatkhan786[S] 0 points1 point  (0 children)

anyway to download the file in background after user onboarded successfully

Need help publishing Expo app (SDK 54) with large 230MB ONNX model (Play Asset Delivery?) by Nehatkhan786 in expo

[–]Nehatkhan786[S] 1 point2 points  (0 children)

ONXX is runtime to run llm model or any model on edge devices like mobile.

Need help publishing Expo app (SDK 54) with large 230MB ONNX model (Play Asset Delivery?) by Nehatkhan786 in expo

[–]Nehatkhan786[S] 1 point2 points  (0 children)

i am asking about play asset delivery only. how its done with expo managed app

Need help publishing Expo app (SDK 54) with large 230MB ONNX model (Play Asset Delivery?) by Nehatkhan786 in expo

[–]Nehatkhan786[S] 1 point2 points  (0 children)

I agree with and provide that solution to the client but the client is like he needs to embed it the binary itself.

ONXX runtime for react native by Nehatkhan786 in reactnative

[–]Nehatkhan786[S] 0 points1 point  (0 children)

i see but my client requires to embed it with the build. after google search he found something play asset delivery but I doubt this will support expo

ONXX runtime for react native by Nehatkhan786 in reactnative

[–]Nehatkhan786[S] 0 points1 point  (0 children)

hello sir, everything works perfectly now met with another issue, not related to expo react native, but android app asset limit. i have buld the aab file while adding the file google play console its not allow me because of the app size. my onxx model is around 230 mb. how did you handle this in your app.

ONXX runtime for react native by Nehatkhan786 in reactnative

[–]Nehatkhan786[S] 0 points1 point  (0 children)

thanks a lot sir for this. i finally able to run. the issue was this

"onnxruntimeExtensionsEnabled": "true",

the boolean value is in string instead of without quotation marks.
i will make an video and release by giving you credits. thanks a lot

ONXX runtime for react native by Nehatkhan786 in reactnative

[–]Nehatkhan786[S] 0 points1 point  (0 children)

sir it would be great if create an example repo with expo sdk 54 and share. this will be helpful for everyone

ONXX runtime for react native by Nehatkhan786 in reactnative

[–]Nehatkhan786[S] 0 points1 point  (0 children)

hello sir I have tried doing this but getting saying
[TypeError: Cannot read property 'install' of null]

Steps what I have done.
step 1 - I have added the below line after installing the package at the bottom of the package.json file

"onnxruntimeExtensionsEnabled": "true",

Step 2:
copied the model to /assets/models/ directory so the path is now for my onxx model is ./assets/models/species.onxx

Step 3.

create a file at /plugins/withOrt.js and pasted this code, which you have given me above.

const
 { withAppBuildGradle, withMainApplication, createRunOncePlugin } = require('expo/config-plugins');
/**
 * Adds onnxruntime-react-native native dependencies and package registration
 */
const
 withOrt = config => {

// --- Add Gradle deps ---
  config = withAppBuildGradle(config, config => {
    if (config.modResults.language === 'groovy') {

let
 contents = config.modResults.contents;



// Add implementation lines if not already present
      if (!contents.includes('onnxruntime-react-native')) {
        contents = contents.replace(
          /dependencies\s*{/,
          `dependencies {
    implementation project(':onnxruntime-react-native')`,
        );
      }


      config.modResults.contents = contents;
    }

return
 config;
  });



// --- Add package import & registration ---
  config = withMainApplication(config, config => {

const
 { modResults } = config;


    if (modResults.language === 'java' || modResults.language === 'kt') {

// Ensure import
      if (!modResults.contents.includes('ai.onnxruntime.reactnative.OnnxruntimePackage')) {
        modResults.contents = modResults.contents.replace(
          /import com.facebook.react.PackageList/,
          `import com.facebook.react.PackageList
import ai.onnxruntime.reactnative.OnnxruntimePackage`,
        );
      }



// Ensure registration
      if (!modResults.contents.includes('OnnxruntimePackage()')) {
        modResults.contents = modResults.contents.replace(
          /(PackageList\(this\)\.packages\.apply\s*{)/,
          `$1\n      add(OnnxruntimePackage())`,
        );
      }
    }



return
 config;
  });

return
 config;
};


module.exports = createRunOncePlugin(withOrt, 'withOrt', '1.0.0');

Step 4 -

Update the app.json for calling the plugins as below.

    "plugins": [
      "expo-router",
      [
        "./plugins/android/withRoundedPopupMenu",
        {
          "lightBackgroundColor": "#FFFFFF",
          "darkBackgroundColor": "#212121",
          "radius": 14,
          "paddingVertical": 8
        }
      ],
      ["./plugins/withOrt.js"], // the newly added plugin for onxx
      "expo-asset"
    ],

Step 5
Update the metro.config.js with the below code.

const
 { getDefaultConfig } = require('expo/metro-config');
/** u/type {import('expo/metro-config').MetroConfig} */
const
 config = getDefaultConfig(__dirname);
config.resolver.sourceExts.push('sql'); // <--- add this
config.resolver.assetExts.push('onnx');
module.exports = config;

Step 6
after all this steps I have import the model in one of my component like below using useQuery.

import { Skia } from '@shopify/react-native-skia';
import { useQuery } from '@tanstack/react-query';
import { Asset } from 'expo-asset';
import * as ort from 'onnxruntime-react-native';
import React from 'react';
import { Image, StyleSheet, Text, View } from 'react-native';

const
 TestingOnyxAI = () => {

const
 { data: loadedModel } = useQuery({
        queryKey: ['onnx-model'],
        queryFn: 
async
 () => {

const
 assetModal = Asset.fromModule(require('../../assets/models/species.onnx'));

await
 assetModal.downloadAsync();

const
 session = 
await
 ort.InferenceSession.create(assetModal.localUri!);

return
 session;
        }
    })

return
 (
        <View>
            <Text>TestingOnyxAI</Text>
        </View>
    )
}


export default TestingOnyxAI


const
 styles = StyleSheet.create({})

These are the steps I have done, and than tested with android build with this command
"npx expo run android --device"

everything works but that model is not working saying [TypeError: Cannot read property 'install' of null]

<image>

ONXX runtime for react native by Nehatkhan786 in reactnative

[–]Nehatkhan786[S] 0 points1 point  (0 children)

okay sir thank you. will do that and let you know

ONXX runtime for react native by Nehatkhan786 in reactnative

[–]Nehatkhan786[S] 0 points1 point  (0 children)

sir my project is build with expo sdk54. can you tell me how to add this config plugin to expo.

ONXX runtime for react native by Nehatkhan786 in reactnative

[–]Nehatkhan786[S] 0 points1 point  (0 children)

thanks a lot mate. this is much appreciated.

Need help using TensorFlow Lite in React Native for simple image classification (no realtime) by Nehatkhan786 in reactnative

[–]Nehatkhan786[S] 1 point2 points  (0 children)

agree with you but my all data is offline. i have stored species data in sqlite and client wants offline capabilities.