Local Machine: No plugin found in Storage for the provider, Production: 403 error

[ajitgoel]

I am trying to upload a user's private file to AWS storage and I am facing 2 issues, a. Storage.put throws a Uncaught (in promise) No plugin found in Storage for the provider on my local machine b.. when I publish the application to aws, I get a r[a].trim is not a function, the server responded with a status of 403 (Forbidden). I am using "@aws-amplify/storage": "^3.1.9", "@aws-amplify/ui-vue": "^0.2.5", "aws-amplify": "^3.0.11". I had previously updated to the latest versions of the above libraries but I faced the same issues.

Error in production:

[[WARN] 52:13.681 AWSS3Provider - error uploading TypeError: r[a].trim is not a function
    at P (chunk-vendors.3a69780c.js:96)
    at e.<anonymous> (chunk-vendors.3a69780c.js:96)
    at c (chunk-vendors.3a69780c.js:111)
    at Object.next (chunk-vendors.3a69780c.js:111)
    at s (chunk-vendors.3a69780c.js:111)

Code(edited for brevity):

import { Auth } from 'aws-amplify';
import Storage from "@aws-amplify/storage";
var i;
        for (i = 0; i < validFilesData.length; i++) 
        {
          let objectToBeUploaded=validFilesData[i];
          let config={level: 'private', contentType: 'video/mp4',};
          let result =await Storage.put('test.mp4', objectToBeUploaded, config);
        }

aws-exports.js:

const awsmobile = {
    "aws_project_region": "us-east-1",
    "aws_cognito_identity_pool_id": "us-east-1:d5bdd6ce-4ef4-4d25-81ac-47bcf08d9007",
    "aws_cognito_region": "us-east-1",
    "aws_user_pools_id": "us-east-1_b6sLX6k7X",
    "aws_user_pools_web_client_id": "6plmdr9nj2oo7hdofugbpctd6l",
    "oauth": {},
    "aws_appsync_graphqlEndpoint": "https://yoxnhmkqojgsjjsmdudy5ytuli.appsync-api.us-east-1.amazonaws.com/graphql",
    "aws_appsync_region": "us-east-1",
    "aws_appsync_authenticationType": "AMAZON_COGNITO_USER_POOLS",
    "aws_cloud_logic_custom": [
        {
            "name": "priceperhour",
            "endpoint": "https://qirua8wpa3.execute-api.us-east-1.amazonaws.com/dev",
            "region": "us-east-1"
        },
        {
            "name": "PaymentIntent",
            "endpoint": "https://kalgi2en0k.execute-api.us-east-1.amazonaws.com/dev",
            "region": "us-east-1"
        },
        {
            "name": "CreatePaymentIntent",
            "endpoint": "https://dplo9lvadc.execute-api.us-east-1.amazonaws.com/dev",
            "region": "us-east-1"
        }
    ],
    "aws_user_files_s3_bucket": "vidaudtranscriptionb772eac002c6449096461a128cad70417-dev",
    "aws_user_files_s3_bucket_region": "us-east-1",
    "aws_content_delivery_bucket": "vidaudtranscription-20200703222552-hostingbucket-dev",
    "aws_content_delivery_bucket_region": "us-east-1",
    "aws_content_delivery_url": "http://vidaudtranscription-20200703222552-hostingbucket-dev.s3-website-us-east-1.amazonaws.com"
};
export default awsmobile;

main.js:

import Amplify,{Storage} from 'aws-amplify';
import '@aws-amplify/ui-vue';
// @ts-ignore
import aws_exports from './aws-exports';
Amplify.configure(aws_exports);

Environment

``` npx: installed 1 in 3.114s System: OS: Windows 10 10.0.19041 CPU: (4) x64 Intel(R) Core(TM) i5-2520M CPU @ 2.50GHz Memory: 2.86 GB / 9.88 GB Binaries: Node: 12.16.1 - C:\Program Files\nodejs\node.EXE Yarn: 1.17.3 - C:\Program Files (x86)\Yarn\bin\yarn.CMD npm: 6.14.5 - C:\Users\ajitgoel\AppData\Roaming\npm\npm.CMD Browsers: Edge: 44.19041.1.0 Internet Explorer: 11.0.19041.1 npmPackages: @aws-amplify/storage: ^3.1.9 => 3.2.7 @aws-amplify/ui-vue: ^0.2.5 => 0.2.8 @chenfengyuan/vue-countdown: ^1.1.2 => 1.1.5 @fortawesome/fontawesome-free: ^5.13.0 => 5.13.1 @fullhuman/postcss-purgecss: ^1.2.0 => 1.3.0 @react-native-community/netinfo: ^5.5.0 => 5.9.4 @stripe/stripe-js: ^1.7.0 => 1.7.0 @syncfusion/ej2-vue-buttons: ^18.1.48 => 18.1.56 @syncfusion/ej2-vue-dropdowns: ^18.1.59 => 18.1.59 @syncfusion/ej2-vue-grids: ^18.1.46 => 18.1.59 @syncfusion/ej2-vue-inputs: ^18.1.59 => 18.1.59 @syncfusion/ej2-vue-lists: ^18.1.53 => 18.1.53 @syncfusion/ej2-vue-popups: ^18.1.52 => 18.1.57 @types/chart.js: ^2.9.20 => 2.9.22 @types/jest: ^24.0.19 => 24.9.1 @types/vue2-hammer: ^2.1.0 => 2.1.1 @vue/cli-plugin-babel: ^3.7.0 => 3.12.1 @vue/cli-plugin-unit-jest: ^4.3.1 => 4.4.6 @vue/cli-service: ^3.7.0 => 3.12.1 @vue/test-utils: ^1.0.0-beta.31 => 1.0.3 ag-grid-community: ^21.0.1 => 21.2.2 ag-grid-vue: ^21.0.1 => 21.2.2 algoliasearch: ^3.33.0 => 3.35.1 apexcharts: ^3.6.12 => 3.19.3 aws-amplify: ^3.0.11 => 3.0.18 axios: ^0.19.2 => 0.19.2 axios-mock-adapter: ^1.17.0 => 1.18.1 chart.js: ^2.8.0 => 2.9.3 core-js: 2.6.5 => 2.6.5 echarts: ^4.2.1 => 4.8.0 file-saver: 2.0.1 => 2.0.1 html2pdf.js: ^0.9.2 => 0.9.2 idle-vue: ^2.0.5 => 2.0.5 instantsearch.css: ^7.3.1 => 7.4.2 jest-localstorage-mock: ^2.4.2 => 2.4.2 jsonwebtoken: ^8.5.1 => 8.5.1 material-icons: ^0.3.1 => 0.3.1 node-sass: ^4.12.0 => 4.14.1 perfect-scrollbar: ^1.4.0 => 1.5.0 postcss-rtl: ^1.5.0 => 1.7.3 prismjs: ^1.16.0 => 1.20.0 purgecss: ^1.3.0 => 1.4.2 sass-loader: ^7.1.0 => 7.3.1 script-loader: 0.7.2 => 0.7.2 tailwindcss: ^1.0.1 => 1.4.6 uuid: ^8.0.0 => 8.2.0 vee-validate: ^2.2.8 => 2.2.15 vue: ^2.6.11 => 2.6.11 vue-acl: 4.0.7 => 4.0.7 vue-apexcharts: ^1.3.5 => 1.5.3 vue-awesome-swiper: ^3.1.3 => 3.1.3 vue-backtotop: ^1.6.1 => 1.6.1 vue-chartjs: ^3.4.2 => 3.5.0 vue-clipboard2: ^0.3.0 => 0.3.1 vue-context: 4.0.0 => 4.0.0 vue-echarts: ^4.0.3 => 4.1.0 vue-feather-icons: ^5.0.0 => 5.0.0 vue-flatpickr-component: ^8.1.2 => 8.1.5 vue-form-wizard: ^0.8.4 => 0.8.4 vue-fullcalendar: ^1.0.9 => 1.0.9 vue-i18n: ^8.11.2 => 8.18.2 vue-instantsearch: ^2.2.1 => 2.7.1 vue-perfect-scrollbar: ^0.1.0 => 0.1.0 vue-print-nb: ^1.5.0 => 1.5.0 vue-prism-component: ^1.1.1 => 1.2.0 vue-property-decorator: ^7.2.0 => 7.3.0 vue-quill-editor: ^3.0.6 => 3.0.6 vue-router: ^3.0.6 => 3.3.4 vue-select: ^3.1.0 => 3.10.5 vue-simple-calendar: ^4.2.2 => 4.4.0 vue-simple-suggest: ^1.9.5 => 1.10.1 vue-star-rating: ^1.6.1 => 1.6.1 vue-template-compiler: ^2.6.10 => 2.6.11 vue-tour: ^1.1.0 => 1.4.0 vue-tree-halower: ^1.8.0 => 1.8.3 vue-video-player: ^5.0.2 => 5.0.2 vue2-google-maps: ^0.10.6 => 0.10.7 vue2-hammer: ^2.1.2 => 2.1.2 vuedraggable: ^2.21.0 => 2.23.2 vuejs-datepicker: ^1.5.4 => 1.6.2 vuesax: 3.11.1 => 3.11.1 vuex: ^3.1.1 => 3.5.1 xlsx: ^0.15.0 => 0.15.6 npmGlobalPackages: @angular/cli: 9.1.0 @aws-amplify/cli: 4.22.0 @types/react: 16.9.19 @vue/cli: 4.3.1 aws-cdk: 1.31.0 create-react-app: 3.4.1 eslint: 6.8.0 expo-cli: 3.17.15 gulp-cli: 2.1.0 inquirer: 7.0.4 maka-cli: 2.18.4 mup: 1.4.6 npm-check-updates: 2.15.0 npm: 6.14.5 serverless: 1.65.0 typescript: 3.8.3 vue-cli: 2.9.6 waves-cli: 1.7.5 webli: 1.0.8 yarn: 1.22.4 ```

[ajitgoel]

I was ale to this working by using promises instead of async\await, i.e by changing changed let result =await Storage.put('test.mp4', objectToBeUploaded, config); to

    Storage.put('test.mp4', objectToBeUploaded,config).then(async function(result) 
    {console.log(`result : ${JSON.stringify(result)}`);})

[github-actions[bot]]

This issue has been automatically locked since there hasn't been any recent activity after it was closed. Please open a new issue for related bugs.

Looking for a help forum? We recommend joining the Amplify Community Discord server *-help channels or Discussions for those types of questions.