Ich lerne VueJS und NodeJS, um die Authentifizierung für ein bevorstehendes Studentenprojekt einzurichten.
Zu diesem Zweck habe ich eine API erstellt, die die Erstellung von Charakterkarten ermöglicht, auf die geklickt werden kann, um den Verlauf des Charakters anzuzeigen.
Es hat gut funktioniert, also habe ich den Authentifizierungsteil gehackt und es geschafft, die Benutzererstellung zuzulassen und den letzten mit jsonwebtoken zu verbinden und alles hat im Backend funktioniert, aber wenn ich im Frontend bin, kann ich auf die Zeichen zugreifen, wenn der Benutzer eine Verbindung herstellt. Das geht nicht funktioniert und gibt den Fehler zurück, den ich geschrieben habe, wenn nichts funktioniert. Ich möchte angeben, dass das Token beim Herstellen einer Verbindung einwandfrei erstellt wird, da das Backend es problemlos mit der Benutzer-ID zurückgibt. Wenn ich jedoch zur Zeichenseite komme und mir die Header der Anfrage ansehe, wird die Meldung „Autorisierung“ nicht angezeigt : Halten Es gibt ein „Token“ und ich weiß nicht, ob ich am Frontend noch etwas anderes tun soll, als eine Zeichenliste abzurufen
Ich habe mich gefragt, ob das Problem nicht vom npm-Paket „cors“ herrührt, das ich heruntergeladen und die Berechtigungen in den Anforderungsheadern neu geschrieben habe, aber nichts hat funktioniert.
Ich möchte angeben, dass ich Axios verwende, um meine Charakterliste abzurufen.
Ich kann das Token in der Anmeldeanforderung erhalten, weiß aber nicht, wie ich es verwenden soll, um dem Benutzer den Zugriff auf die Zeichen zu ermöglichen
Dies ist ein nicht autorisierter Fehler, wenn die Anmeldung funktioniert und zu einer Zeichenliste weitergeleitet wird:
Hier ist die Authentifizierungs-Middleware aus dem Backend:
Dies ist mein Weg mit der Authentifizierungs-Middleware:
Es tut mir leid, wenn ich hier etwas übersehen habe, wie man eine gute Frage schreibt. Ich bin Stackoverflow nicht gewohnt. Wenn ich also genauere Informationen bereitstellen muss, lassen Sie es mich bitte in den Kommentaren wissen
Danke fürs Lesen
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
您应该为每个需要身份验证的请求设置授权标头。
如果您对请求使用自定义 axios 实例，则可以使用拦截器指定授权标头，例如：
axiosInstance.interceptors.request.use(config => { const token = /* your token */; if (token) { config.headers.Authorization = `Bearer ${token}`; } return config; });或者，如果您不使用这样的实例，您可以将其设置为：
axios.defaults.headers.common['Authorization'] = `Bearer ${token}`;