You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
146 lines
6.3 KiB
146 lines
6.3 KiB
3 weeks ago
|
@@master_page.html
|
||
|
<div id="apibox" class="col-lg-12">
|
||
|
<div class="card">
|
||
|
<div class="card-header"><h4>授权说明</h4></div>
|
||
|
<div class="card-body">
|
||
|
<div class="form-group">
|
||
|
<div class="alert alert-success">一、用户表不存需要创建表</div>
|
||
|
<p> 1、Json文件禁用授权 </p>
|
||
|
<p> 2、实体管理创建【用户实体】,然后点同步生成【用户表】 </p>
|
||
|
<p> 3、创建【用户插入接口】 </p>
|
||
|
<p> 4、插入用户名密码(密码前端加密好) </p>
|
||
|
<div class="alert alert-success">二、用户表存在只需四步</div>
|
||
|
<p> 1、完成json配置启用授权 </p>
|
||
|
<p> 2、输入用户名密码获取Token (密码前端加密好) </p>
|
||
|
<p> 3、保存Token </p>
|
||
|
<p> 4、其他页面能正常访问说明授权成功,未成功接口都是返回401 </p>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="card">
|
||
|
<div class="card-header"><h4>保存登录</h4><code>【支持所有JWT】</code></div>
|
||
|
<div class="card-body">
|
||
|
<div class="form-group">
|
||
|
<label>ToKen</label>
|
||
|
<input v-model="txtToken" id="txtToken" class="form-control" type="text" name="role-input" placeholder="保存后请求都会加上Token">
|
||
|
</div>
|
||
|
|
||
|
<div class="form-group">
|
||
|
<button type="button" @click="submitToken" class="btn btn-primary ajax-post" target-form="add-form">确 定</button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="card">
|
||
|
<div class="card-header"><h4>获取Token</h4> <code>【仅支持自带JWT】</code></div>
|
||
|
<div class="card-body">
|
||
|
|
||
|
<div class="form-group">
|
||
|
<label>用户名</label>
|
||
|
<input v-model="userName" class="form-control" type="text" name="role-input" placeholder="用户名">
|
||
|
</div>
|
||
|
<div class="form-group">
|
||
|
<label>密码</label>
|
||
|
<input id="txtpassword" v-model="password" class="form-control" type="text" name="role-input" placeholder="前端加密好的密码">
|
||
|
<button class="btn btn-xs btn-primary m-t-10" @click="MD5">MD5</button>
|
||
|
</div>
|
||
|
<div class="form-group">
|
||
|
<label>结果:</label>
|
||
|
<textarea class="form-control">{{result}}</textarea>
|
||
|
</div>
|
||
|
<div class="form-group">
|
||
|
<button type="button" @click="getToken" class="btn btn-primary ajax-post" target-form="add-form">确 定</button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="card">
|
||
|
<div class="card-header"><h4>测试授权 <code>【仅支持自带JWT】</code></h4></div>
|
||
|
<div class="card-body">
|
||
|
<div class="form-group">
|
||
|
<div class="alert alert-success">获取JWT信息</div>
|
||
|
<div>Url: /api/rezero/getuserinfo </div>
|
||
|
<button class="btn btn-primary m-t-10" @click="getUserInfo">确定</button>
|
||
|
</div>
|
||
|
<div class="form-group">
|
||
|
<label>结果:</label>
|
||
|
<textarea rows="5" class="form-control">{{jwtInfo}}</textarea>
|
||
|
<code>注意:如果成功,内置接口访问不了可能是 DisableSystemInterface 禁用了 </code>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<script src="js/crypto/core.js"></script>
|
||
|
<script src="js/crypto/md5.js"></script>
|
||
|
<script>
|
||
|
var vueObj = new Vue({
|
||
|
el: '#apibox',
|
||
|
data: {
|
||
|
data: null,
|
||
|
error: null,
|
||
|
txtToken: null,
|
||
|
userName: null,
|
||
|
password: null,
|
||
|
result: null,
|
||
|
jwtInfo:null,
|
||
|
hashedPasswords: []
|
||
|
},
|
||
|
mounted() {
|
||
|
if (jwHeader && jwHeader.headers) {
|
||
|
this.txtToken = (jwHeader.headers.Authorization + "")
|
||
|
.replace("Bearer null", "Bearer ")
|
||
|
.replace("Bearer ", "");
|
||
|
}
|
||
|
},
|
||
|
methods: {
|
||
|
submitToken: function () {
|
||
|
if (!this.txtToken) {
|
||
|
tools.alert("token不能为空");
|
||
|
} else {
|
||
|
localStorage["@@authorizationLocalStorageName"] = this.txtToken;
|
||
|
tools.alert("设置成功");
|
||
|
setTimeout(function () {
|
||
|
window.location.href = "/rezero/Authorization.html";
|
||
|
}, 1000);
|
||
|
}
|
||
|
},
|
||
|
getToken: function () {
|
||
|
if (!this.userName || !this.password) {
|
||
|
tools.alert("用户名或者密码不能为空");
|
||
|
} else {
|
||
|
axios.post("/api/rezero/token?supportCustomDto=true", { userName: this.userName, password: this.password+"" }, jwHeader)
|
||
|
.then(response => {
|
||
|
this.error = null;
|
||
|
this.result = response.data;
|
||
|
})
|
||
|
.catch(error => {
|
||
|
this.error = error.message;
|
||
|
this.data = null;
|
||
|
});
|
||
|
}
|
||
|
},
|
||
|
MD5: function ()
|
||
|
{
|
||
|
if (this.password) {
|
||
|
// No need to hash if password is already hashed
|
||
|
var existingHash = this.hashedPasswords.find(entry => entry.password === this.password);
|
||
|
if (!existingHash) {
|
||
|
var hashedPassword = CryptoJS.MD5(this.password);
|
||
|
this.password = hashedPassword;
|
||
|
this.hashedPasswords.push({ password: this.password, hashedPassword });
|
||
|
}
|
||
|
}
|
||
|
},
|
||
|
getUserInfo: function ()
|
||
|
{
|
||
|
axios.get("/api/rezero/getuserinfo", jwHeader)
|
||
|
.then(response => {
|
||
|
this.error = null;
|
||
|
this.jwtInfo = response.data;
|
||
|
})
|
||
|
.catch(error => {
|
||
|
this.error = error.message;
|
||
|
this.data = null;
|
||
|
});
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
</script>
|