RN Fetch blog use Android Storage - react-native

var path = RNFetchBlob.fs.dirs.DocumentDir
RNFetchBlob
.config({
path: toFile,
addAndroidDownloads: {
useDownloadManager: true,
mime: 'text/plain',
description: 'Downloading...',
notification: false
}
})
.fetch('GET', fromUrl)
.progress((received, total) => {
})
I am using the above code for downloading files in the react-native. This is working fine in IOS. But not working with android.
I also tried
var path = RNFetchBlob.fs.dirs.DownloadDir
I also check with permission in Manifest
<uses-permission android:name="android.permission.MANAGE_DOCUMENTS"/>
But nothing worked so Please let me know how can i resolve it. In the android and download files in the com.appname folder.
Thanks

Related

Expo-AV not loading audio from server on iOS

I am building an audio player for my react native expo project. I am using expo-av to play the sound that I am pulling from my AWS s3 bucket. I am using expo SDK 44. Everything works fine on Android, but I am receiving an error on iOS:
[Unhandled promise rejection: Error: This media format is not supported. - The AVPlayerItem instance has failed with the error code -11828 and domain "AVFoundationErrorDomain".]
-I have tried this with both .mp3 and .m4a files
-everything works on android
-local files work on iOS (require('./myaudiotrack.mp3') but not from my bucket
-this seems to be a problem with the URL that is being returned from the s3bucket and it is working with a URL with an audio file extension.
async function PlayPause() {
await Audio.setAudioModeAsync({
staysActiveInBackground: true,
interruptionModeAndroid: Audio.INTERRUPTION_MODE_ANDROID_DO_NOT_MIX,
shouldDuckAndroid: false,
playThroughEarpieceAndroid: false,
allowsRecordingIOS: false,
interruptionModeIOS: Audio.INTERRUPTION_MODE_IOS_DO_NOT_MIX,
playsInSilentModeIOS: true,
});
const { sound } = await Audio.Sound.createAsync(
{uri: AudioUri}, <------ this works on android, not ios
//require('../assets/zelda.mp3'), <--this works
{
shouldPlay: true,
rate: 1.0,
shouldCorrectPitch: false,
volume: 1.0,
isMuted: false,
isLooping: false,
},
);
setSound(sound);
await sound.playAsync();
}
I was able to fix the problem by declaring a file type using contentType: "audio/mp3" during the bucket upload.

Ionic 4 View PDF

Under android 10 (Samsung A50), I installed the document viewer plugin to be able to open a pdf that I have on a website.
ionic cordova plugin add cordova-plugin-document-viewer
npm install # ionic-native / document-viewer
When I try to open the pdf, it offers me to open it with google play store or galaxy store.
I would like to know what I am doing wrong, and if there is any way to open the pdf directly, without choosing which program to open it with.
I send used code, and I also inform them that with fileopener it works correctly, except that it asks me if I want to open with the pdf viewer or another program, and I want the opening of the pdf to be direct, without that step of choosing a program.
Ionic CLI : 6.10.0
Ionic Framework : #ionic/angular 4.11.5
#angular/cli : 8.1.3
Cordova CLI : 9.0.0 (cordova-lib#9.0.1)
Cordova Platforms : android 8.1.0
*********************************************
async pdf2() {
const options: DocumentViewerOptions = {
title: 'My PDF',
openWith: { enabled: true},
bookmarks : {
enabled : true
},
search : {
enabled : true
},
autoClose: {
onPause : true
}
}
let path = null;
if (this.platform.is('ios')) {
path = this.file.documentsDirectory;
} else {
path = this.file.dataDirectory;
}
const transfer = this.transfer.create();
transfer.download('https://www.zzzzz.com/site/pdfs/blabla.pdf', path + 'myfile.pdf').then(entry => {
let url = entry.toURL();
this.document.viewDocument(url, 'application/pdf', options);
})
}
thanks!!

Strapi file upload doesn't work in production

I have a problem when uploading files in production with strapi. I have deployed strapi on Heroku and I am using the upload-provider-asws-s3 for files upload.
I created a settings.js file in extensions/upload/config with the following code :
if (process.env.NODE_ENV === 'production') {
module.exports = {
provider: "aws-s3",
providerOptions: {
accessKeyId: process.env.ACCESS_KEY_ID,
secretAccessKey: process.env.SECRET_ACCESS_KEY,
region: "xxxxxxxxx",
params: {
Bucket: "xxxxxxxxx"
}
}
};
} else {
module.exports = {}
}
but when I connect to the strapi production admin and try to upload files, my s3 bucket won't load the files. I connected the same aws-s3 config to the development mode (just to test) and it worked perfectly. It is like heroku won't connect to aws-s3 but I don't get what I miss in my configuration to be able to upload files in the production mode.
Thank you all for your help!

react-native cannot find node_modules that exists. this probably only occurs when I use yarn workspaces

In order to add it I ran the following command:
yarn workspace mobile add react-native-webview
I literally have looked in the node_modules folders that is specific by the error below and react-native-webview is clearly in there. However, this error is still always thrown? I even did the steps react-native outlines on the red error screen says when a module is shown as missing but is actually there.
Error: Unable to resolve module `react-native-webview` from `index.js`: react-native-webview could not be found within the project or in these directories:
../../node_modules
/Users/kurnalsaini/Documents/test-mono/packages/mobile/node_modules
Am I suppose to be modifying my metro-config file or some other config file to get this working? Because to me it's boggling that it's telling it's looking in the correct folders and still saying it doesn't exist.
Try to set your metro config to watch for node_modules in the directory shown in the error, your metro.config.js should look like this:
const path = require("path");
const watchFolders = [
//Relative path to packages directory
path.resolve(__dirname + "/.."),
path.resolve(__dirname + "/../../node_modules"),
];
module.exports = {
resetCache: true,
transformer: {
getTransformOptions: async () => ({
transform: {
experimentalImportSupport: false,
inlineRequires: false,
},
}),
},
watchFolders,
};

How to add custom fonts to react-native v0.61.x?

How to add custom fonts in react-native 0.61.x. After 0.60+ added auto linking, I dont know how to link custom fonts.
When I execute this command:
react-native link
This make some aditional linking which generate extra error.
So how Can I Link only fonts folder.
create an assets folder in your project directory and then create a fonts folder and paste any custom fonts that you want then add this code snippet to the react-native.config.js file in the root of your project(if the file doesn't exist create it).
module.exports = {
project:{
ios: {},
android: {}
},
assets: ["./assets/fonts"]
}
after all run react-native link to link the resources to your project.
you will be able to use fonts now. for example, I have a yekan.ttf font in my fonts folder you can use it like this:
const styles = StyleSheet.create({
text: {
fontFamily: "yekan",
},
})
as you see use custom fonts without their extension I mean don't put for example .ttf at the end otherwise, it won't work.
create a file in root (react-native.config.js)
module.exports = {
project: {
ios: {},
android: {}, // grouped into "project"
},
assets: ['./assets/fonts'], // stays the same
};
Create a folder called assets in root and paste the font file under fonts
folder(assets/fonts/xxxx.ttf)
Run npx react-native link in command line.
You can add custom font in react-native using expo-font.
Install >> expo install expo-font
import * as Font from 'expo-font'
loadFonts=async()=> {
await Font.loadAsync({
// Load a font `Montserrat` from a static resource
popinsmed: require('../../assets/fonts/DMSans-Regular.ttf'),
// Any string can be used as the fontFamily name. Here we use an object to provide more control
Montserrat-SemiBold': {
uri: require('../../assets/fonts/Poppins-Medium.ttf'),
display: Font.FontDisplay.FALLBACK,
},
});
this.setState({ fontsLoaded: true });
}
componentDidMount(){
this.loadFonts();
}
render(){
return(
<View><Text style={{fontFamily:"popinsmed"}}>This is a custom font</Text></View>
)
}
For reference, click here.