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:
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);
}
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.