java - Problème de séparation du code de vérification de l'avant vers l'arrière

Question

Prémisse

Supposons que j'ai une interface pour obtenir les codes de vérification. Elle se trouve ci-dessous https://api.b.com/captcha.

La façon dont j'ai imaginé actualiser le code de vérification

Dans mon imagination, la fonction d'actualisation du code de vérification est implémentée en ajoutant un horodatage après l'URL, par exemple en changeant l'URL en quelque chose comme ceci

https://api.b.com/captcha?149...

Méthode traditionnelle de vérification du code de vérification

Le code de vérification traditionnel doit être effectué principalement via la session. Le front-end enregistrera un identifiant de session dans le cookie.

Le backend enregistrera également cet identifiant de session et son code de vérification correspondant dans redis.

Le front-end a une fonction pour actualiser le code de vérification en cliquant dessus. Chaque fois que vous cliquez, un nouveau code de vérification sera généré et la valeur du code de vérification correspondant à l'ID de session sera mise à jour dans Redis à chaque fois.

La méthode de vérification est complétée en demandant si la valeur de l'identifiant de session dans Redis est cohérente avec la valeur frontale.

Problèmes rencontrés jusqu'à présent

Maintenant, je travaille sur un projet qui sépare le front-end et le back-end.

Ensuite, il y a un problème de cookies inter-domaines que je ne sais pas comment résoudre.

Le scénario est le suivant : le projet front-end est sous le nom de domaine de www.a.com, et le projet back-end est sous le nom de domaine de api.b.com.

Le front-end et le back-end sont sous des noms de domaines différents (en fait, il est également possible de mettre les deux projets sous le même nom de domaine, mais cela n'est pas fait à des fins d'apprentissage), le cookie ne peut donc pas être partagé, en d'autres termes, je ne parviens pas à obtenir l'identifiant de session. La méthode traditionnelle ne semble alors plus possible.

PS : Le serveur frontal utilisera nginx et le back-end utilisera spring-boot.

Mes pensées

Idée 1

Je souhaite générer un jeton simple. Le jeton contient uniquement un uuid, qui est utilisé pour identifier l'utilisateur. Je compare l'uuid de ce toekn avec l'uuid de redis pour déterminer si la valeur du code de vérification est correcte. Je retournerai donc un résultat comme celui-ci

{
   image : base64转码后的图片,
   token : uuid
}

Quant à la raison pour laquelle nous publions des images transcodées en base64, c'est principalement parce que la balise img frontale prend en charge base64. Ce n'est pas un problème de l'afficher directement (ce n'est pas un projet qui ne prend pas en compte les anciens navigateurs).

Mais cela ne semble pas très raisonnable de procéder ainsi. Car de cette façon, lorsque vous accéderez à l’adresse du code de vérification, vous ne pourrez pas voir l’image du code de vérification. Il n'est pas pratique de déboguer et d'afficher le style du code de vérification. En fait, ce n'est pas particulièrement gênant. C'est juste que je dois écrire un js pour définir le src de l'img.

Idée 2

Mettez le jeton dans l'en-tête de la réponse. js peut lire le contenu de l'en-tête de réponse. Ensuite, l'image du code de vérification peut également être affichée directement via l'adresse. Mais bon sang, ça aussi semble stupide. Parce que je ne peux pas utiliser la façon dont j'imaginais pour actualiser le code de vérification. Ajoutez simplement un horodatage plus tard et modifiez-le.

Idée 3

Je ne me soucie pas du code de vérification. Laissez le serveur frontal faire cela. Lors de la connexion, vérifiez le code de vérification sur le serveur frontal. Ensuite, mon back-end vérifie uniquement si le mot de passe du compte est correct et renvoie. un jeton. Apportez simplement le jeton chaque fois que vous accédez à d’autres API.

---

Je ne sais vraiment pas comment faire et je ne trouve aucune information pertinente (il y a peut-être un problème avec ma méthode de recherche), alors je demande de l'aide...

J'ai vérifié attentivement et ce problème devrait être un problème d'authentification unique, n'est-ce pas ?

Answer 1

Ce que vous devez résoudre, c'est le problème du transfert de cookies entre domaines. Tout d'abord, assurez-vous que vous utilisez la technologie cors sur tous les domaines. Cors peut envoyer des informations d'identification basées sur des cookies HTTP et des informations d'authentification HTTP. Les cookies sont envoyés au serveur en définissant l'indicateur withCredentials de XMLHttpRequest sur true.

var invocation = new XMLHttpRequest();
var url = 'http://bar.other/resources/credentialed-content/';
    
function callOtherDomain(){
  if(invocation) {
    invocation.open('GET', url, true);
    invocation.withCredentials = true;
    invocation.onreadystatechange = handler;
    invocation.send(); 
  }
}

En plus d'ajouter withCredential à la requête frontale, l'en-tête de réponse du serveur doit également être ajoutéAccess-Control-Allow-Credentials: true. De plus, l'en-tête de réponse ne peut pas définir la valeur de Access-Control-Allow-Origin sur "*" et doit la définir sur la source spécifique http://foo.example.