前端访问OAuth2授权服务器
前端必须要提交:username: “”用户账号password: “”用户密码grant_type: ‘password’ (一般固定是password)client_id: ‘appid’ (这些值都是后端写死的)client_secret: ‘223344’(这些值都是后端写死的)<template><!-- 这里定义vue组件的模板内容 --><div>
·
前端必须要提交:
username: “” 用户账号
password: “” 用户密码
grant_type: ‘password’ (一般固定是password)
client_id: ‘appid’ (这些值都是后端写死的)
client_secret: ‘223344’(这些值都是后端写死的)
<template>
<!-- 这里定义vue组件的模板内容 -->
<div>
<h2>登录首页</h2>
<p>username:<input type="text" v-model="login.username" /></p>
<p>password:<input type="text" v-model="login.password" /></p>
<hr>
<button @click="dologin">登录</button>
<router-view></router-view>
</div>
</template>
<script>
// 这里定义vue组件的业务逻辑
export default {
//参数
props: {},
//私有数据
data() {
return {
login: {
username: "",
password: "",
grant_type: 'password',
client_id: 'appid',
client_secret: '223344',
}
}
},
methods: { //处理函数
//其它业务处理
dologin() {
let param = "username=" + this.login.username + "&";
param += "password=" + this.login.password + "&";
param += "grant_type=" + this.login.grant_type + "&";
param += "client_id=" + this.login.client_id + "&";
param += "client_secret=" + this.login.client_secret;
var that = this;
this.$axios({
url: "http://192.168.117.34:8080/oauth/token",
method: 'post',
data: param
}).then(function(resp) {
localStorage.setItem('token',resp.data.access_token);
resp.data.access_token
console.log(resp);
console.log(resp.data);
}).catch(function(err) {
console.log(err);
})
}
},
mounted() {
//预加载
}
}
</script>
<template>
<!-- 这里定义vue组件的模板内容 -->
<div>
<h2>学生首页</h2>
<hr>
<button>添加学生</button>
<!-- <router-view></router-view> -->
<button @click="goApiStuX">获取学生</button>
</div>
</template>
<script>
// 这里定义vue组件的业务逻辑
export default{
//参数
props:{},
//私有数据
data(){
return{
}
},
methods:{//处理函数
//其它业务处理
goApiStuX(){
let token=localStorage.getItem('token');
console.log(token);
this.$axios({
url:"http://192.168.117.34:8080/api/stu/hello",
headers:{
Authorization:"Bearer "+token
}
}).then(function(resp){
console.log(resp);
console.log(resp.data);
})
}
},
mounted () {
//预加载
}
}
</script>
更多推荐
已为社区贡献1条内容
所有评论(0)