在 vercel 上托管时 NuxtJS 生产中的 URIError

Question

我正在 nuxt 中使用 ssr 开发一个应用程序。我遇到的问题是在完成构建和生成后运行 “npm start”。该应用程序开始正常工作，但是当我尝试登录时它不起作用，尽管在开发模式下它运行良好。 api 是用 express 构建的，我使用令牌和 nuxt auth 作为身份验证方法。在身份验证策略中声明的服务器端点永远不会执行，请在登录端点处理程序上使用 console.log () 进行检查。任何人都知道我该如何解决这个问题？感谢您的宝贵时间！

登录组件脚本：

<script>
import { mapGetters } from 'vuex'
import index from './index.vue'

export default {
  components: {
    index,
  },
  data() {
    return {
      email: '',
      password: '',
    }
  },
  computed: {
    ...mapGetters(['isAuthenticated']),
  },
  methods: {
    close() {
      this.$router.push('/')
    },
    login() {
      const button = document.querySelector('.center-form button')
      button.disabled = true
      button.innerHTML = '...'

      const data = { password: this.password, email: this.email }
      this.$auth
        .loginWith('local', { data })
        .then((x) => {
          this.$auth.strategy.token.set(x.data.token)
          this.$router.push('publicar-inmueble')
        })
        .catch((err) => {
          console.log(err)
        })
    },
  },
}
</script>

Nuxt认证策略：

auth: {
  strategies: {
    local: {
      token: {
        property: 'token'
      },
      user: {
        property: 'user'
      },
      endpoints: {
        login: { url: '/server/api/usuarios/login', method: 'post', propertyName: 'data' },
        user: { url: '/server/api/usuarios/mi-perfil', method: 'get', propertyName: 'data' },
        logout: { url: '/server/api/usuarios/logout', method: 'delete' }
      }
    }
  }
},

商店：

export const getters = {
  isAuthenticated(state) {
    return state.auth.loggedIn
  },

  loggedInUser(state) {
    return state.auth.user
  }
}

Answer 1

在 Vercel 上转到您应用的设置，URL 应该如下所示：
https://vercel.com/<your-username>/<your-project>/settings/environment-variables

在那里，放入您的环境变量（我的屏幕截图是一个值示例！）并触发您的应用程序构建。那么应该可以正常工作。

在 vercel 上托管时 NuxtJS 生产中的 URIError

URIError in NuxtJS production when hosting on vercel

javascript

vue.js

nuxt.js

vercel