AWS Amplify redirect middleware NuxtJs requests not working

453 Views Asked by At

I tried to deploy vuestorefront (nuxtjs app) into AWS Amplify according https://docs.amplify.aws/guides/hosting/nuxt/q/platform/js/

My amplify.yml contains:

version: 1
frontend:
  phases:
    preBuild:
      commands:
        - yarn install
    build:
      commands:
        - yarn run generate
  artifacts:
    baseDirectory: dist
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

And I set next data into redirect & rewrites section:

[
    {
        "source": "/<*>",
        "target": "/index.html",
        "status": "404-200",
        "condition": null
    },
    {
        "source": "</^[^.]+$|\\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|ttf|map|json)$)([^.]+$)/>",
        "target": "/index.html",
        "status": "200",
        "condition": null
    }
]

However, Requests sent to Middlerware generate a "301" with "cancelled" like next example: Redirect error

I have a form into page.vue with middleware call:

import oauthToken from '~/api/getToken';
...
  methods: {
    singIn(e) {
      oauthToken(this.email, this.password);

File ~/api/getToken have an axios to call middleware:

import axios from 'axios';

const oauthToken = (email, password) => {
  let result;
  axios({
    method: 'GET', url: '/oauth2.js',
    headers: { email, password, },
  })
    .then((res) => {
      console.log(JSON.parse(JSON.stringify(res.data.access_token)));
    })
    .catch((err) => console.log(err));

  return result;
};

export default oauthToken;

/oauth2.js GET (in server-middleware/custom-features.js):

app.get('/oauth2.js', (req, res) => {
...
      res.status(200).send(response.data);
}

1

There are 1 best solutions below

0
Heitor On BEST ANSWER

Vue Storefront requires an active node server, and it's not yet supported to do Lambda deployment yet. We are working on bringing this solution to the framework.