Vue Login mit Axios Request HTTP

Question

Ich bin neu bei Vue und ich versuche, eine Anfrage HTTP an mein Backend zu machen,

Wenn ich in meinem Browser inspiziere, erhalte ich das Zugriffstoken von / login, aber in der API / users erhalte ich "Token ist ungültig". Wie erhalte ich meine API- / Benutzerdaten?

import axios from "axios";
export default {
  name: "login",
  async created() {
    const response = await axios.get("api/users", {
      headers: {
        Authorization: "Bearer " + localStorage.getItem("token")
      }
    });

    console.log(response);
  },

  data() {
    return {
      showError: false,
      email: "",
      password: "",
    };
  },

  methods: {
    async EnvioLogin() {
      try {
        const response = await axios.post("api/auth/login", {
          email: this.email,
          password: this.password,
        });
        localStorage.setItem("token", response.data.token);
        const status = JSON.parse(response.status);
        if (status == "200") {
          console.log(response);
          this.$router.push("intermediorotas");
        }
      } catch (error) {
        this.showError = true;
        setTimeout(() => {
          this.showError = false;
        }, 3000);
      }
    },
  },

Answer 1

Sie können einen Dienst erstellen, um das Backend aufzurufen. Ich denke, das Problem ist die URL http: // localhots: 3000 / api. Sie haben diesen Teil http: // localhots: 3000 verpasst

import axios from 'axios'
const client = axios.create({
  baseURL: 'http://localhots:3000/api',
  headers: {
    'Content-Type': 'application/json',
  },
})
export default client

Importieren Sie dann den Dienst

import myService from './myService'
await myService.get(`/auth/login`, {})