AWS amplify Predictions Text-to-Speech Error in react native cli

[zahirtanin1397]

Before opening, please confirm:

• I have searched for duplicate or closed issues and discussions.
• I have read the guide for submitting bug reports.
• I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

React Native

Amplify APIs

Predictions

Amplify Version

v5

Amplify Categories

predictions

Backend

None

Environment information

System:
OS: Windows 10 10.0.19045
CPU: (8) x64 Intel(R) Core(TM) i5-8250U CPU @ 1.60GHz
Memory: 691.27 MB / 6.06 GB
Binaries:
Node: 18.16.1 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.21 - ~\AppData\Roaming\npm\yarn.CMD
npm: 9.5.1 - C:\Program Files\nodejs\npm.CMD
Browsers:
Chrome: 125.0.6422.0
Edge: Chromium (123.0.2420.97)
Internet Explorer: 11.0.19041.3636
npmPackages:
@aws-amplify/predictions: ^5.5.11 => 5.5.12
@aws-amplify/react-native: ^1.0.28 => 1.0.28
@babel/core: ^7.20.0 => 7.24.3
@babel/preset-env: ^7.20.0 => 7.24.3
@babel/runtime: ^7.20.0 => 7.24.1
@react-native-async-storage/async-storage: ^1.23.1 => 1.23.1
@react-native-community/netinfo: ^11.3.1 => 11.3.1
@react-native-masked-view/masked-view: ^0.3.1 => 0.3.1
@react-native/babel-preset: 0.73.21 => 0.73.21
@react-native/eslint-config: 0.73.2 => 0.73.2
@react-native/metro-config: 0.73.5 => 0.73.5
@react-native/typescript-config: 0.73.1 => 0.73.1
@react-navigation/bottom-tabs: ^7.0.0-alpha.20 => 7.0.0-alpha.20
@react-navigation/material-top-tabs: ^6.6.13 => 6.6.13
@react-navigation/native: ^7.0.0-alpha.17 => 7.0.0-alpha.17
@react-navigation/native-stack: ^7.0.0-alpha.18 => 7.0.0-alpha.18
@types/react: ^18.2.6 => 18.2.67
@types/react-test-renderer: ^18.0.0 => 18.0.7
HelloWorld: 0.0.1
aws-amplify: ^5.3.18 => 5.3.18
babel-jest: ^29.6.3 => 29.7.0
eslint: ^8.19.0 => 8.57.0
jest: ^29.6.3 => 29.7.0
prettier: 2.8.8 => 2.8.8
react: 18.2.0 => 18.2.0
react-native: 0.73.6 => 0.73.6
react-native-blob-util: ^0.19.9 => 0.19.9
react-native-fs: ^2.20.0 => 2.20.0
react-native-gesture-handler: ^2.15.0 => 2.15.0
react-native-get-random-values: ^1.11.0 => 1.11.0
react-native-pager-view: ^6.3.0 => 6.3.0
react-native-reanimated: ^3.8.1 => 3.8.1
react-native-safe-area-context: ^4.9.0 => 4.9.0
react-native-screens: ^3.29.0 => 3.29.0
react-native-sound-player: ^0.13.2 => 0.13.2
react-native-tab-view: ^3.5.2 => 3.5.2
react-native-vector-icons: ^10.0.3 => 10.0.3
react-test-renderer: 18.2.0 => 18.2.0
typescript: 5.0.4 => 5.0.4
npmGlobalPackages:
@aws-amplify/cli: 12.11.1
create-expo-app: 2.3.1
eas-cli: 7.6.0
npm: 9.5.1
typescript: 5.4.2
yarn: 1.22.21

Describe the bug

in react native cli app i use aws amplify Predictions to convert text to speech it is code but it show error error {"err": [Error: Cannot create URL for blob!]} please anyone help me to solve this error and produce the speech from text

Expected behavior

produce the speech from text in aws amplify predictions

Reproduction steps

LOG {"err": [Error: Cannot create URL for blob!]}
LOG {"err": [Error: Cannot create URL for blob!]}
LOG {"err": [Error: Cannot create URL for blob!]}
LOG {"err": [Error: Cannot create URL for blob!]}

Code Snippet

const Speech = () => {
try {
const speechResult = Predictions.convert({
textToSpeech: {
source: {
text: 'Hello',
},
"VoiceId": "Kimberly",
"LanguageCode": "en-US"

    }
  });
  console.log('success', speechResult);
} catch (error) {
  console.log('Error converting text to speech:', error);
}

};

Log output

error {"err": [Error: Cannot create URL for blob!]}

aws-exports.js

const awsmobile = {
"aws_project_region": "ap-south-1",
"aws_cognito_identity_pool_id": "ap-south-1:xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx",
"aws_cognito_region": "ap-south-1",
"aws_user_pools_id": "ap-south-1_xxxxxxxxx",
"aws_user_pools_web_client_id": "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
"oauth": {},
"aws_cognito_username_attributes": [
"EMAIL"
],
"aws_cognito_social_providers": [],
"aws_cognito_signup_attributes": [
"NAME",
"EMAIL"
],
"aws_cognito_mfa_configuration": "OFF",
"aws_cognito_mfa_types": [
"SMS"
],
"aws_cognito_password_protection_settings": {
"passwordPolicyMinLength": 8,
"passwordPolicyCharacters": [
"REQUIRES_LOWERCASE",
"REQUIRES_NUMBERS",
"REQUIRES_SYMBOLS",
"REQUIRES_UPPERCASE"
]
},
"aws_cognito_verification_mechanisms": [
"EMAIL"
],
"predictions": {
"convert": {
"translateText": {
"region": "ap-south-1",
"proxy": false,
"defaults": {
"sourceLanguage": "en",
"targetLanguage": "ar"
}
},
"speechGenerator": {
"region": "ap-south-1",
"proxy": false,
"defaults": {
"VoiceId": "Kimberly",
"LanguageCode": "en-US"
}
}
}
}
};

export default awsmobile;

Manual configuration

const awsmobile = {
"aws_project_region": "ap-south-1",
"aws_cognito_identity_pool_id": "ap-south-1:xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx",
"aws_cognito_region": "ap-south-1",
"aws_user_pools_id": "ap-south-1_xxxxxxxxx",
"aws_user_pools_web_client_id": "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
"oauth": {},
"aws_cognito_username_attributes": [
"EMAIL"
],
"aws_cognito_social_providers": [],
"aws_cognito_signup_attributes": [
"NAME",
"EMAIL"
],
"aws_cognito_mfa_configuration": "OFF",
"aws_cognito_mfa_types": [
"SMS"
],
"aws_cognito_password_protection_settings": {
"passwordPolicyMinLength": 8,
"passwordPolicyCharacters": [
"REQUIRES_LOWERCASE",
"REQUIRES_NUMBERS",
"REQUIRES_SYMBOLS",
"REQUIRES_UPPERCASE"
]
},
"aws_cognito_verification_mechanisms": [
"EMAIL"
],
"predictions": {
"convert": {
"translateText": {
"region": "ap-south-1",
"proxy": false,
"defaults": {
"sourceLanguage": "en",
"targetLanguage": "ar"
}
},
"speechGenerator": {
"region": "ap-south-1",
"proxy": false,
"defaults": {
"VoiceId": "Kimberly",
"LanguageCode": "en-US"
}
}
}
}
};

export default awsmobile;

Additional configuration

const awsmobile = {
"aws_project_region": "ap-south-1",
"aws_cognito_identity_pool_id": "ap-south-1:xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx",
"aws_cognito_region": "ap-south-1",
"aws_user_pools_id": "ap-south-1_xxxxxxxxx",
"aws_user_pools_web_client_id": "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
"oauth": {},
"aws_cognito_username_attributes": [
"EMAIL"
],
"aws_cognito_social_providers": [],
"aws_cognito_signup_attributes": [
"NAME",
"EMAIL"
],
"aws_cognito_mfa_configuration": "OFF",
"aws_cognito_mfa_types": [
"SMS"
],
"aws_cognito_password_protection_settings": {
"passwordPolicyMinLength": 8,
"passwordPolicyCharacters": [
"REQUIRES_LOWERCASE",
"REQUIRES_NUMBERS",
"REQUIRES_SYMBOLS",
"REQUIRES_UPPERCASE"
]
},
"aws_cognito_verification_mechanisms": [
"EMAIL"
],
"predictions": {
"convert": {
"translateText": {
"region": "ap-south-1",
"proxy": false,
"defaults": {
"sourceLanguage": "en",
"targetLanguage": "ar"
}
},
"speechGenerator": {
"region": "ap-south-1",
"proxy": false,
"defaults": {
"VoiceId": "Kimberly",
"LanguageCode": "en-US"
}
}
}
}
};

export default awsmobile;

Mobile Device

Android

Mobile Operating System

Android 8.1

Mobile Browser

Chrome

Mobile Browser Version

No response

Additional information and screenshots

{
"name": "Linkdin",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"lint": "eslint .",
"start": "react-native start",
"test": "jest"
},
"dependencies": {
"@aws-amplify/predictions": "^5.5.11",
"@aws-amplify/react-native": "^1.0.28",
"@react-native-async-storage/async-storage": "^1.23.1",
"@react-native-community/netinfo": "^11.3.1",
"@react-native-masked-view/masked-view": "^0.3.1",
"@react-navigation/bottom-tabs": "^7.0.0-alpha.20",
"@react-navigation/material-top-tabs": "^6.6.13",
"@react-navigation/native": "^7.0.0-alpha.17",
"@react-navigation/native-stack": "^7.0.0-alpha.18",
"aws-amplify": "^5.3.18",
"react": "18.2.0",
"react-native": "0.73.6",
"react-native-blob-util": "^0.19.9",
"react-native-fs": "^2.20.0",
"react-native-gesture-handler": "^2.15.0",
"react-native-get-random-values": "^1.11.0",
"react-native-pager-view": "^6.3.0",
"react-native-reanimated": "^3.8.1",
"react-native-safe-area-context": "^4.9.0",
"react-native-screens": "^3.29.0",
"react-native-sound-player": "^0.13.2",
"react-native-tab-view": "^3.5.2",
"react-native-vector-icons": "^10.0.3"
},
"devDependencies": {
"@babel/core": "^7.20.0",
"@babel/preset-env": "^7.20.0",
"@babel/runtime": "^7.20.0",
"@react-native/babel-preset": "0.73.21",
"@react-native/eslint-config": "0.73.2",
"@react-native/metro-config": "0.73.5",
"@react-native/typescript-config": "0.73.1",
"@types/react": "^18.2.6",
"@types/react-test-renderer": "^18.0.0",
"babel-jest": "^29.6.3",
"eslint": "^8.19.0",
"jest": "^29.6.3",
"prettier": "2.8.8",
"react-test-renderer": "18.2.0",
"typescript": "5.0.4"
},
"engines": {
"node": ">=18"
}
}

[cwomack]

Hello, @zahirtanin1397 and sorry to hear you're running into this issue. I'll work on reproducing this error to determine a workaround or if it's a bug. In the mean time, can you clarify if you were just following the "happy path" from the docs for v5 of Amplify and Predictions? Or was there any variations from the docs that were done in order to reproduce this? Thanks!

[zahirtanin1397]

Hello, @cwomack sorry i response late. yes i follow the amplify predictions for text to speech i am using v5.
And show this cannot create url for blob

[HuiSF]

The error should be thrown from this line:

amplify-js/packages/predictions/src/providers/AmazonAIConvertPredictionsProvider.ts

Line 181 in 93f0536

const url = URL.createObjectURL(blob);

URL is not natively available in react-native, so is the interaction with Blob. Amplify requires to install react-native-url-polyfill so that URL is usable. According to the instruction of this package, to use URL.createObjectURL() requires a manual set up of the native Android App in a react-native project.

Could you follow the instruction @zahirtanin1397 to set up the Blob provider and test again?

[cwomack]

@zahirtanin1397, let us if you had a chance to review @HuiSF's suggestions above and if you're still experiencing this issue.

[cwomack]

Closing this issue as we have not heard back from you. If you are still experiencing this, please feel free to reply back and provide any information previously requested and we'd be happy to re-open the issue.

Thank you!

[primelxz]

I'm developing an app for ios, and I still face this problem.