'AWS Amplify redirect middleware NuxtJs requests not working
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);
}
Solution 1:[1]
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.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 |