无服务器nuxt应用中的路由不起作用

Question

所以每当我使用nuxt ssr和serverless时，我都会遇到一个路由问题。当我使用部署到AWS或使用serverless-offline时，它会生成以/{stage}为前缀的url，但nuxt似乎无法处理此问题，并且抛出403、404或500错误，因为指向静态文件的路由没有以/{stage}为前缀。

我尝试在构建时将{stage}添加到公共路径，结果是404，因为现在静态文件路径需要加上另一个/{stage}作为前缀。如果我直接转到{stage}/{stage}/_nuxt/{file}，它就能工作。

build: {
    publicPath: '/{stage}/_nuxt'
}

所以环顾四周，我发现我可以将路由器基础更新为以下内容

router: {
   base: '/{stage}'
}

但是现在这个文件只有在它的{stage}/{stage}/{stage}/_nuxt/{file}时才会加载，并且移除上面的publicPath代码也不会使它工作。

这是针对静态文件的，当涉及到实际路由时，主页设置为'/‘，但其他页面不起作用，因为它们的nuxt-link没有以/{stage}为前缀，或者如果我在基础上加上前缀，当我访问/{stage}时，我会得到一个Cannot GET /错误。

我已经尝试了很多不同的方法，比如使用express，但我一直没有运气，我在网上找到的任何教程都至少有2年的历史，github repos也有同样的问题。我在stackoverflow上找到的与我的stackoverflow有些相似的最接近的东西是here，但这是一个静态站点。

有谁有什么想法吗？下面是serverless.yaml、handler.js、nuxt.js、nuxt.config.js的代码。

Github Repo

serverless.yaml

service: nuxt-ssr-lambda

provider:
  name: aws
  runtime: nodejs12.x
  stage: ${env:STAGE}
  region: eu-west-1
  lambdaHashingVersion: 20201221
  environment: 
    NODE_ENV: ${env:STAGE}
  apiGateway:
    shouldStartNameWithService: true

functions:
  nuxt:
    handler: handler.nuxt
    events:
      - http: ANY /
      - http: ANY /{proxy+}

plugins: 
  - serverless-apigw-binary
  - serverless-dotenv-plugin
  - serverless-offline

custom:
  apigwBinary:
    types:
      - '*/*'

handler.js

const sls = require('serverless-http')
const binaryMimeTypes = require('./binaryMimeTypes')
const nuxt = require('./nuxt')

module.exports.nuxt = sls(nuxt, {
    binary: binaryMimeTypes
})

nuxt.js

const { Nuxt } = require('nuxt')

const config = require('./nuxt.config.js')

const nuxt = new Nuxt({ ...config, dev: false })

module.exports = (req, res) =>
    nuxt.ready().then(() => nuxt.server.app(req, res))

nuxt.config.js

module.exports = {
  telemetry: false,

  head: {
    htmlAttrs: {
      lang: 'en'
    },
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: '' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },

  css: [
  ],

  plugins: [
  ],

  components: true,

  buildModules: [
    '@nuxtjs/tailwindcss',
  ],

  modules: [
  ],

  router: {
    base: '/prod'
  },

  build: {
  }
}

Answer 1

你是不是把它当作

    <p>Path: {{ $route.path }}</p>
    <NuxtLink to="/">Back to Mountains</NuxtLink>

如果是Yes，那么它应该可以工作，否则请尝试使用redirect('/{stage}/_nuxt')

对于一个if语句，把这个放在里面，我认为它应该可以工作。