Provided an image that is available locally already - android

I'm using React Native and Firebase in my app. And out of nowhere I just started recieving this error:
SyntaxError: Unexpected end of JSON input.
at doWrite(_stream_writable.js)
at Promise.resolve.then.then.then.catch.then.message
and in my react packager it is pointing to this code:
onProfilesChange = async (snap) => {
var allProfilePromises = []
snap.forEach((child) => {
var profileId = child.val().profileId
var alreadyAdded = this.state.profiles.some(x => x.id === profileId)
if (alreadyAdded === false) {
var profilePromise = this.registerOnProfileChanges(profileId)
allProfilePromises.push(profilePromise)
}
})
await Promise.all(allProfilePromises)
var profileCount = snap.numChildren()
this.setState({ profiles: this.state.profiles, loading: false, profileCount: profileCount })
if (profileCount <= 0) {
this.getUserName()
}
}
which is being run when componentMount is called. Now the error is quite clear, but I don't know WHY it is being produced, nor how to get passed it. This code has worked for months without me changing anything to it.
Thank in advance.

try clearing cache and restart the server...
cd android & gradlew clean & cd .. & rm -rf node_modules/ & npm cache clean --force & yarn install & react-native run-android
you may want to use npm i instead of yarn install

I met the same problem. It is relevant to image.
I solved this by changing the version of react-native-img-cache.
run this:
npm install react-native-img-cache#1.4.0

Related

cordova build android fails: Cannot find module 'C:[...]\platforms\android\cordova\lib\AndroidStudio'

I am building an Ionic app and I'd like to use the plugin firebasex.
Unfortunately, when running Ionic cordova build/run android, I am getting the following error:
Cannot find module 'C:\[...]\platforms\android\cordova\lib\AndroidStudio'
I have tried everything: remove and add back the platform, cleaning caches, re installing modules via npm install ...
Here's my environnement:
Ionic:
Ionic CLI : 5.2.3
Utility:
cordova-res : not installed
native-run : 0.2.8
System:
NodeJS : v10.15.3
npm : 6.4.1
OS : Windows 10
I just want the app to build and deploy.
Found the solution:
Create file \platforms\android\cordova\lib\AndroidStudio.js
/*
* This is a simple routine that checks if project is an Android Studio Project
*
* #param {String} root Root folder of the project
*/
/* jshint esnext: false */
var path = require('path');
var fs = require('fs');
var CordovaError = require('cordova-common').CordovaError;
module.exports.isAndroidStudioProject = function isAndroidStudioProject (root) {
var eclipseFiles = ['AndroidManifest.xml', 'libs', 'res'];
var androidStudioFiles = ['app', 'app/src/main'];
// assume it is an AS project and not an Eclipse project
var isEclipse = false;
var isAS = true;
if (!fs.existsSync(root)) {
throw new CordovaError('AndroidStudio.js:inAndroidStudioProject root does not exist: ' + root);
}
// if any of the following exists, then we are not an ASProj
eclipseFiles.forEach(function (file) {
if (fs.existsSync(path.join(root, file))) {
isEclipse = true;
}
});
// if it is NOT an eclipse project, check that all required files exist
if (!isEclipse) {
androidStudioFiles.forEach(function (file) {
if (!fs.existsSync(path.join(root, file))) {
console.log('missing file :: ' + file);
isAS = false;
}
});
}
return (!isEclipse && isAS);
};
Can you do the following steps:
cordova clean android (or IOS)
rm -rf node_modules
npm install
cordova build android
Check out this source on github:
https://github.com/ionic-team/ionic-cli/issues/3301
Hope this helps for you
Can you try the flowing,
This
is helps to add platform in your app.
Check ANDROID_HOME setted correctly. echo $ANDROID_HOME
If you setted correctly. but it was not showing in command prompt means use source ~/.bash_profile or source ~/.bashrc
I hope these are helps you

RNFetchBlob.mkdir got 1 arguments, expected 2

When i try to setup ongoing react-native project in that one of the plugin is react-native-fetch-blob i'll try many but can't resolve this issue.
also i remove that plugin from app and resetup all step from npm react-native-fetch-blob
after following all step getting same issue.
`RNFetchBlob.fetch('POST', 'api', {
'Content-Type': 'application/multipart/form-data'
}, [
{name: 'file', filename: filename, data: RNFetchBlob.wrap(PictureURI)}
])
.then((responseData) => {
// console.log("image uploaded",responseData);
// console.log("----------Upload Image Test---RESPONSE---------");
})
.catch(err => {
// console.log(err);
// console.log("----------Upload Image Test---RESPONSE--ERROR-------");
})`
in this plugin i'm only used the fetch method but my project gives me error mkdir method.
Resolve this issue following steps:
react-native unlink react-native-fetch-blob
npm uninstall react-native-fetch-blob --save
yarn add react-native-fetch-blob (assuming your system already
installed yarn)
RNFB_ANDROID_PERMISSIONS=true react-native link
then uninstall app from device/simulator/emulator and run command
react-native run-android
work perfect.
:)

Expo v27/v28 Android App with websocket is crashing

Environment: Android 6 Marshmallow and iOS(all versions)
Error: Android app with WebSockets is crashing with error:
WebSocketModule.close got 1 arguments, expected 3.
The error happens when I close the WebSocket connection just on Android, for instance:
this.ws = new WebSocket(url);
this.ws.onopen = () => {
const command = { command: 'JOIN', room: roonHash };
this.ws.send(JSON.stringify(command));
};
this.ws.onmessage = e => {
//more code here
};
// Finally:
this.ws.close();
iOS:
On iOS it works fine.
I'm using Expo v27 but I got the same error on v28.
Is there any workaround fixing that until the Expo/React Native team fixes it forever?
Expo v27
Update your React Native/Expo v27.0.0 to v27.0.2 on your package.json
Expo v28
Update your React Native/Expo v28.0.0 to v28.0.1 on your package.json
Procedures:
1) Go to your package.json file and change the version of your expo, for example:
From:
"react-native": "https://github.com/expo/react-native/archive/sdk-27.0.0.tar.gz",
To:
"react-native": "https://github.com/expo/react-native/archive/sdk-27.0.2.tar.gz",
2) Delete your node_modules:
$ rm -rf node_modules
3) Install it again:
$ yarn install

Error while trying to access files in the app

I'm building a react-native app that uses tensorflow to recognize images, I'm following the steps in this tutorial.
I did everything according to the explanations, including the part of "Fetching files". I created the assets folder and put the files in it (the path is correct).
But when I run this code:
const tfImageRecognition = new TfImageRecognition({
model: require('./assets/tensorflow_inception_graph.pb'),
labels: require('./assets/tensorflow_labels.txt'),
});
The app gives the following error:
I already tried to create a new project, I imported the react-native-tensorflow import { TfImageRecognition } from 'react-native-tensorflow';, I updated the cache, I deleted the folder node_modules and also I created the file "rn-cli.config.js" that is requested in the tutorial to give access to the files in the assets folder. Any idea how to fix this?
I'm using expo to run the app on mobile (android).
npm: 5.51
expo: 51.4.0
react-native: 0.54.0
react-native-cli: 2.0.1
This problem didn't occur with me. Try react-native start --reset-cache and then run the app again.
There is a better way to this.
import model from './assets/tensorflow_inception_graph.pb';
import labels from './assets/tensorflow_labels.txt';
const tfImageRecognition = new TfImageRecognition({
model,
labels
});
Restart your server.
I tried the same example as you mentioned I got accessed Image and Text.
I stored files inside assets in the same directory. Can you share code to produce an error that you faced?
async recognizeImage() {
try {
const tfImageRecognition = new TfImageRecognition({
model:require('./assets/tensorflow_inception_graph.pb'),
labels: require('./assets/tensorflow_labels.txt')
})
const results = await tfImageRecognition.recognize({
image: this.image
})
const resultText = `Name: ${results[0].name} - Confidence: ${results[0].confidence}`
this.setState({result: resultText})
await tfImageRecognition.close()
} catch(err) {
alert(err)
}
}
As you mentioned your using expo then I'm assuming that run npm eject already. As react-native-tensorflow this library require native changes
You must add extensions in your rn-cli.config.js, in order to require tensorflow_inception_graph.pb and tensorflow_labels.txt
module.exports = {
getAssetExts() {
return ['pb', 'txt']
}
}
Replace ./ with so ../ , so final code will be -
model: require('../assets/tensorflow_inception_graph.pb'),
labels: require('../assets/tensorflow_labels.txt')

React native - reload do nothing

I just started with React Native. I have my smartphone connected and after react-native run-android I can see "Hello World" on the screen. But when I change "Hello World" to something else, save the file, and then tap on the reload command on my device (after shaking phone), I can't see any changes. I need to react-native run-android again to see new things. I am working on Windows 10. Also build takes a lot of time. I have read similar things, but didn't find any reasonable solution. Can anyone help?
Also: Sometimes when I tap Reload then I need to press enter in packager server terminal, to reload view, but changes don't appear.
I had the same issue and found several solutions. The following is working for me:
To enable life reloading with the >0.29 react-native-versions
go to file: yourProjectFolder//node_modules/react-native/local-cli/server/server.js
Commend the line (62): process.exit(11) -> //process.exit(11)
About Point 2: I am not sure since when the solution of 2.1. is needed but i think ~ react-native v.33. Please correct this if someone knows exactly. For you just look if you find the index.js at the 2. or 2.1. path.
2.1 (Older Path of React-Native FileWatcher index.js) Go to file: yourProjectFolder//node_modules/react-native/node_modules\node-haste\lib\FileWatcher\index.js"
2.2 (Newer Path of React-Native FileWatcher index.js) Go to file:
yourProjectFolder\node_modules\react-native\packager\react-packager\src\node-haste\FileWatcher\index.js
STEP 1 for 2.1 + 2.2:
Increase at the top of the index.js file: MAX_WAIT_TIME=120000 > MAX_WAIT_TIME=360000
Change function (_createWatcher) to:
STEP 2 for 2.1 (Older Path of index.js)
key: '_createWatcher',
value: function _createWatcher(rootConfig) {
var watcher = new WatcherClass(rootConfig.dir, {
glob: rootConfig.globs,
dot: false
});
return new Promise(function (resolve, reject) {
const rejectTimeout = setTimeout(function() {
reject(new Error([
'Watcher took too long to load',
'Try running `watchman version` from your terminal',
'https://facebook.github.io/watchman/docs/troubleshooting.html',
].join('\n')));
}, MAX_WAIT_TIME);
watcher.once('ready', function () {
clearTimeout(rejectTimeout);
resolve(watcher);
});
});
}
STEP 2 for 2.2 (Newer Path of index.js)
_createWatcher(rootConfig) {
var watcher = new WatcherClass(rootConfig.dir, {
glob: rootConfig.globs,
dot: false
});
return new Promise(function (resolve, reject) {
const rejectTimeout = setTimeout(function() {
reject(new Error([
'Watcher took too long to load',
'Try running `watchman version` from your terminal',
'https://facebook.github.io/watchman/docs/troubleshooting.html',
].join('\n')));
}, MAX_WAIT_TIME);
watcher.once('ready', function () {
clearTimeout(rejectTimeout);
resolve(watcher);
});
});
}
This solution worked for me. Hope I could help you and correct me if I am wrong.

Categories

Resources