add token

pangu
PeterAlbus 3 years ago
parent 56f1eac7c8
commit 9bc90f9297

@ -7,6 +7,11 @@
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta data-n-head="1" data-hid="description" name="description" content=""> <meta data-n-head="1" data-hid="description" name="description" content="">
<meta data-n-head="1" data-hid="keywords" name="keywords" content=""> <meta data-n-head="1" data-hid="keywords" name="keywords" content="">
<script type="text/javascript" src="https://pv.sohu.com/cityjson?ie=utf-8"></script>
<script>
let Ip=returnCitySN['cip']
localStorage.setItem('ipAddress', Ip)
</script>
<title>PeterAlbus的博客</title> <title>PeterAlbus的博客</title>
</head> </head>
<body> <body>

@ -23,7 +23,20 @@ import 'element-plus/dist/index.css'
axios.defaults.withCredentials=false; axios.defaults.withCredentials=false;
axios.defaults.baseURL='https://www.peteralbus.com:8089/' axios.defaults.baseURL='https://www.peteralbus.com:8089/'
// axios.defaults.baseURL='https://localhost:8089/'
axios.interceptors.request.use(
config => {
if (localStorage.getItem("token")) { //判断token是否存在
// @ts-ignore
config.headers.satoken_peteralbus_blog = localStorage.getItem("token"); //将token设置成请求头
}
return config;
},
err => {
return Promise.reject(err);
}
);
VMdEditor.use(vuepressTheme, { VMdEditor.use(vuepressTheme, {
Prism Prism

@ -8,6 +8,7 @@ const Document=()=>import('../views/Document.vue')
const EditBlog=()=>import('../views/EditBlog.vue') const EditBlog=()=>import('../views/EditBlog.vue')
const UploadPhoto=()=>import('../views/UploadPhoto.vue') const UploadPhoto=()=>import('../views/UploadPhoto.vue')
const AddFriendLink=()=>import('../views/AddFriendLink.vue') const AddFriendLink=()=>import('../views/AddFriendLink.vue')
const Login=()=>import('../views/Login.vue')
const routes: Array<RouteRecordRaw> = [ const routes: Array<RouteRecordRaw> = [
{ {
@ -22,6 +23,18 @@ const routes: Array<RouteRecordRaw> = [
} }
} }
}, },
{
path: '/login',
name: 'Login',
component: Login,
meta:{
title:'登录——PeterAlbus的博客',
content:{
keywords:'PeterAlbus,Vue',
description:'PeterAlbus的博客登录页'
}
}
},
{ {
path: '/blog', path: '/blog',
name: 'Blog', name: 'Blog',

@ -63,7 +63,6 @@ import {onMounted, ref ,nextTick} from "vue";
import {useRoute} from "vue-router"; import {useRoute} from "vue-router";
import {ArrowRight,Notebook,Share as shareIcon} from "@element-plus/icons-vue"; import {ArrowRight,Notebook,Share as shareIcon} from "@element-plus/icons-vue";
import axios from "axios"; import axios from "axios";
import qs from "qs";
import PersonalInfo from '@/components/PersonalInfo.vue' import PersonalInfo from '@/components/PersonalInfo.vue'
import type {vMdEditor} from "@kangc/v-md-editor" import type {vMdEditor} from "@kangc/v-md-editor"
@ -95,7 +94,7 @@ const getBlog=()=>{
.then(res=>{ .then(res=>{
blog.value=res.data; blog.value=res.data;
blog.value.blogViews+=1; blog.value.blogViews+=1;
axios.post('/update',qs.stringify(blog.value)); axios.get('/visitBlog?blogId='+blog.value.blogId+"&ipAddress="+localStorage.getItem('ipAddress'));
document.title = blog.value.blogTitle+'——PeterAlbus的博客' document.title = blog.value.blogTitle+'——PeterAlbus的博客'
let meta:any=document.querySelector('meta[name="description"]') let meta:any=document.querySelector('meta[name="description"]')
if(!meta) if(!meta)

@ -165,33 +165,39 @@ const onSubmit= async (formEl: FormInstance | undefined) => {
if (valid) { if (valid) {
if(blog.value.blogId!==undefined) if(blog.value.blogId!==undefined)
{ {
console.log('update:',blog.value);
axios.post('/update',qs.stringify(blog.value)) axios.post('/update',qs.stringify(blog.value))
.then(res=>{ .then(res=>{
if(res.data!='fail') if(res.data=='fail')
{ {
ElMessage.success('更新成功'); ElMessage.error('更新失败');
router.push('/blog?id='+blog.value.blogId) }
else if(res.data=='noPermission')
{
ElMessage.error('你没有权限进行此操作!');
} }
else else
{ {
ElMessage.error('更新失败'); ElMessage.success('更新成功');
router.push('/blog?id='+blog.value.blogId)
} }
}) })
} }
else else
{ {
console.log('new:',blog.value);
axios.post('/add',qs.stringify(blog.value)) axios.post('/add',qs.stringify(blog.value))
.then(res=>{ .then(res=>{
if(res.data!='fail') if(res.data=='fail')
{ {
ElMessage.success('发布成功'); ElMessage.error('发布失败');
router.push('/blog?id='+blog.value.blogId) }
else if(res.data=='noPermission')
{
ElMessage.error('你没有权限进行此操作!');
} }
else else
{ {
ElMessage.error('发布失败'); ElMessage.success('发布成功');
router.push('/blog?id='+blog.value.blogId)
} }
}) })
} }

@ -0,0 +1,87 @@
<template>
<el-form
ref="ruleFormRef"
:model="loginForm"
:rules="rules"
label-width="120px"
class="demo-ruleForm"
size="default"
style="margin: 100px"
>
<el-form-item label="邮箱" prop="userMail">
<el-input v-model="loginForm.userMail" />
</el-form-item>
<el-form-item label="密码" prop="userPassword">
<el-input v-model="loginForm.userPassword" type="password"/>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm(ruleFormRef)"></el-button>
<el-button @click="resetForm(ruleFormRef)"></el-button>
<el-button @click="logout"></el-button>
</el-form-item>
</el-form>
</template>
<script setup lang="ts">
import { reactive, ref } from 'vue'
import type { FormInstance } from 'element-plus'
import axios from "axios";
import qs from "qs";
import {ElMessage} from "element-plus";
import router from "@/router";
const ruleFormRef = ref<FormInstance>()
const loginForm = reactive({
userMail: '',
userPassword: '',
})
const rules = reactive({
userMail: [
{ required: true, message: '请输入邮箱', trigger: 'change' },
],
userPassword: [
{ required: true, message: '请输入密码', trigger: 'change' },
{ min: 5, max: 60, message: 'Length should be 3 to 5', trigger: 'blur' },
],
})
const submitForm = async (formEl: FormInstance | undefined) => {
if (!formEl) return
await formEl.validate((valid, fields) => {
if (valid) {
axios.post('/user/mailLogin',qs.stringify(loginForm))
.then(res=>{
if(res.data)
{
localStorage.setItem("token",res.data.tokenValue)
ElMessage.success('登录成功');
router.push('/')
}
else
{
ElMessage.error('用户名或密码错误')
}
})
}
})
}
const resetForm = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.resetFields()
}
const logout = () => {
axios.get('/user/logout')
.then((res)=>{
ElMessage.success('登出成功');
localStorage.removeItem("token")
router.push('/')
})
}
</script>
<style scoped>
</style>
Loading…
Cancel
Save