Nuxt Auth 中间件向用户端点发出空请求

Posted 2023-03-07

【中文标题】Nuxt Auth 中间件向用户端点发出空请求

【英文标题】：Nuxt Auth middleware making empty request to the user endpoint

【发布时间】：2020-07-23 10:44:17

【问题描述】：

每个人。我正在尝试构建一个登录模块。我正在使用 Nuxt auth 来处理我的登录工作流程并为我的 RestAPI 使用烧瓶。我已经按照docs 中的指定在nuxt.config.js 中设置了身份验证选项，并将url 调整为我的flask API，如下所示：

auth: 
    strategies: 
      local: 
        endpoints: 
          login:  url: '/auth/', method: 'post', propertyName: 'token' ,
          logout:  url: '/auth/logout', method: 'post' ,
          user:  url: '/users/username/', method: 'post', propertyName: 'User' 
        ,
        // tokenRequired: true,
        // tokenType: 'bearer'
        // autoFetchUser: true
      
    
  

这是我的登录组件：

<template>
  <div>
    <form @submit.prevent="userLogin">
      <div>
        <label>Username</label>
        <input type="text" v-model="login.username" />
      </div>
      <div>
        <label>Password</label>
        <input type="text" v-model="login.password" />
      </div>
      <div>
        <button type="submit">Submit</button>
      </div>
    </form>
  </div>
</template>

<script>
export default 
  data() 
    return 
      login: 
        username: 'newUser27',
        password: 'ninjaTurtles1!'
      
    
  ,
  methods: 
    async userLogin() 
      try 

        let response = await this.$auth.loginWith('local',  data: this.login )

        console.log(response)
       catch (err) 
        console.log(err)
      
    
  

</script>

现在，我遇到的问题是，当我点击登录按钮调用提交表单并调用我的登录函数时，对登录路由的调用成功，请求包含表单中的用户名和密码，我得到回复。如图所示：

Request body 和 Request response

但是，由于请求正文为空，调用用户端点失败，因此服务器无法处理请求，如下图所示： Empty request body in call to user endpoint.

我想我的问题是我是否有某种错误配置导致对用户端点的请求正文为空，从而无法在我的用户中长并保持 this.$auth.loggedIn 和 this.$auth.user 为假。

我到目前为止所做的尝试：

我尝试将 API 中的请求切换为 Post 以查看是否成功 任何差异，正如您在上图中看到的那样，它没有。两个都 get 和 post 请求到达 API 时的正文为空。 我尝试在用户中将propertyName 设置为false 端点。 As mentioned here。仍然遇到同样的问题。 我已经尝试在组件中使用我的登录功能中的this.$auth.fetchUser() 方法，就在let response = await this.$auth.loginWith('local', data: this.login ) 之后。 As recommended in this answerr。仍然遇到同样的问题。

任何建议或帮助将不胜感激。

【问题讨论】：

您在用户端点请求上收到错误 500，这意味着您有内部服务器错误，您可以发送用户端点标题选项卡的屏幕截图吗？

【参考方案1】：

请设置获取请求 nuxt.config 和 api 端点。谢谢

 user:  url: '/users/username/', method: 'get', propertyName: 'User' '

【讨论】：

嗨 Nazmul，感谢您的回答。 tokenRequired 默认情况下为真，我的服务器在响应中已经有“承载”。否则，我会有'Bearer Bearer

您好，您可以试试 user: url: '/users/username/', method: 'get', propertyName: 'User' 尝试获取方法并更改您的 api 以接受获取请求。

【参考方案2】：

根据登录端点，auth 必须接收'token' propertyName，但是在您的响应屏幕截图中显示您收到'auth' 属性作为响应，您应该更改后端以直接返回令牌属性（不是嵌套属性）或更改您的登录端点propertyName，您可以通过调用检查令牌设置是否正确

console.log( this.$auth.getToken('local') );