swa07016

token 기반 mypick username set

This diff is collapsed. Click to expand it.
......@@ -14,7 +14,6 @@
"axios": "^0.19.2",
"bootstrap": "^4.5.0",
"http-proxy-middleware": "^1.0.4",
"mdbreact": "^4.27.0",
"react": "^16.13.1",
"react-app-polyfill": "^1.0.6",
"react-cookies": "^0.1.1",
......
......@@ -69,16 +69,17 @@ const UserCards = (props) => {
'http://localhost:5000/api/datas',
// localhost로 바꾸기
);
setDatas(result.data);
setDatas(result.data);
};
fetchData();
setUsername(cookie.load('username'));
setUsername(props.username);
// setUsername(cookie.load('username'));
}, [username]);
const LogoutHandler = (e) => {
e.preventDefault();
localStorage.removeItem('user');
cookie.remove('username');
// cookie.remove('username');
props.isLogin(false);
return ;
}
......
......@@ -3,9 +3,6 @@ import NavBar from '../components/NavBar';
import MealCard from '../components/MealCard';
import { CustomInput } from 'reactstrap';
import { Container, Row, Col } from "reactstrap";
import { Card, CardText, CardBody, CardTitle, } from "reactstrap";
import axios from 'axios';
import Loading from '../components/Loading';
......@@ -190,9 +187,6 @@ const MenuPage = (props) => {
</Container>)
: <Loading value="Loading.."/>
}
</>
);
}
......
......@@ -9,6 +9,7 @@ import { Container } from 'reactstrap';
const MypickPage = () => {
const [isLogin, setIsLogin] = useState(false);
const [userName, setUserName] = useState('');
const authApi = () => {
const user = JSON.parse(localStorage.getItem('user'));
return fetch('/api/auth', {
......@@ -21,7 +22,7 @@ const MypickPage = () => {
.then(result => {
if(result.message === 'valid token') {
setIsLogin(true);
setUserName(result.username);
} else if(result.message === 'expired token') {
// alert('토큰이 만료되었습니다. 로그인 해주세요.');
setIsLogin(false);
......@@ -42,7 +43,7 @@ const MypickPage = () => {
{
isLogin ?
(<>
<UserCards isLogin={setIsLogin}/>
<UserCards username={userName} isLogin={setIsLogin}/>
</>)
:
(<>
......
......@@ -601,6 +601,11 @@
"safe-buffer": "^5.0.1"
}
},
"jwt-decode": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/jwt-decode/-/jwt-decode-2.2.0.tgz",
"integrity": "sha1-fYa9VmefWM5qhHBKZX3TkruoGnk="
},
"locate-path": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
......
......@@ -21,6 +21,7 @@
"express": "^4.17.1",
"iconv-lite": "^0.5.1",
"jsonwebtoken": "^8.5.1",
"jwt-decode": "^2.2.0",
"mysql": "^2.18.1"
}
}
......
......@@ -4,6 +4,7 @@ const fs = require("fs");
const mysql = require("mysql");
const iconv = require("iconv-lite");
const jwt = require("jsonwebtoken");
const jwt_decode = require('jwt-decode');
const bcrypt = require("bcrypt");
const saltRounds = 10;
......@@ -144,13 +145,17 @@ app.post("/api/signin", (req, res) => {
// ?? ???
app.get('/api/auth', (req, res) => {
// ?? ??
const user = jwt_decode(req.headers.authorization);
console.log(user.name);
try {
// ?? ??? ??? ??(req.headers.authorization)? ???? ???? ?? ??
req.decoded = jwt.verify(req.headers.authorization, jwt_secret_key.value);
return res.status(200).json({
code: 200,
message: 'valid token'
message: 'valid token',
username: user.name
});
}
......