vue는 타사 웹사이트로 이동하여 로그인 후 매개변수를 반환합니다.

<template>
  <div>
    <a href="http://example.com/login?redirect_uri={{redirect_uri}}&client_id={{client_id}}">
      跳转到第三方网站
    </a>
  </div>
</template>

import VueRouter from 'vue-router';
import LoginCallback from './components/LoginCallback.vue';

const router = new VueRouter({
  routes: [
    {
      path: '/login/callback',
      component: LoginCallback
    }
  ]
});

<template>
  <div>
    <p v-if="code">授权码: {{code}}</p>
    <p v-if="state">状态码: {{state}}</p>
  </div>
</template>

<script>
export default {
  name: 'LoginCallback',
  data() {
    return {
      code: this.$route.query.code,
      state: this.$route.query.state
    }
  }
}
</script>

<script>
  import axios from 'axios';

  export default {
    name: 'LoginCallback',
    created() {
      if (this.code) {
        axios.post('/oauth/token', {
          grant_type: 'authorization_code',
          code: this.code,
          redirect_uri: 'http://localhost:8080/login/callback',
          client_id: 'my_client_id',
          client_secret: 'my_client_secret'
        }).then(response => {
          console.log(response.data);
        }).catch(error => {
          console.log(error);
        });
      }
    },
    data() {
      return {
        code: this.$route.query.code,
        state: this.$route.query.state
      }
    }
  }
</script>