Skip to content

Commit

Permalink
Merge pull request #100 from nittre/feature_socketConnection
Browse files Browse the repository at this point in the history
Feature socket connection
  • Loading branch information
nittre authored May 6, 2021
2 parents d48b975 + 61a414c commit 0eed6d0
Show file tree
Hide file tree
Showing 3 changed files with 79 additions and 77 deletions.
71 changes: 36 additions & 35 deletions src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,46 +27,43 @@ export default function App() {

//로그인 상태 관리하기--------------------------------
useEffect(() => {
refreshTokenRequest()
if(accessToken.accessToken!==null){
history.push('/Waiting')
}
},[]);
refreshTokenRequest();
if (accessToken.accessToken !== null) {
history.push('/Waiting');
}
}, []);
const loginHandler = (data) => {
issueAccessToken(data.data.accessToken);
history.push('/Waiting')
history.push('/Waiting');
};

const handleGuestLogin = () => {
setUserInfo({ nickname: '게스트' });
history.push('/Waiting')
history.push('/Waiting');
};
//로그 아웃--------------------------------------------------------
//로그 아웃--------------------------------------------------------
const hendleLogout = () => {
axios
.get(
'http://localhost:4000/user/logout',
{
headers:{
'Content-Type': 'application/json',
'Clear-Site-Data': "cookies"
},
}
).then((res) => {})
.get('http://localhost:4000/user/logout', {
headers: {
'Content-Type': 'application/json',
'Clear-Site-Data': 'cookies',
},
})
.then((res) => {});
setUserInfo({
id: null,
nickname: null,
email: null,
profile_image: Character1,
comment: null,
room_id: null,
})
});
setAccessToken({ accessToken: null });
history.push('/')
history.push('/');
};


//토큰 관리----------------------------------------------------------------------------------------------
//토큰 관리----------------------------------------------------------------------------------------------
const accessTokenRequest = (accessToken) => {
// ! 유저 정보를 알려달라는 코드
axios
Expand Down Expand Up @@ -99,10 +96,11 @@ export default function App() {
withCredentials: true,
})
.then((res) => {
if (res.data.message !== 'ok') {}
if (res.data.message !== 'ok') {
}
const { nickname, email, profile_image } = res.data.data.userInfo;
console.log(res.data.data.accessToken)
setAccessToken({accessToken:res.data.data.accessToken})
console.log(res.data.data.accessToken);
setAccessToken({ accessToken: res.data.data.accessToken });
setUserInfo({
nickname: nickname,
email: email,
Expand All @@ -114,23 +112,26 @@ export default function App() {
const issueAccessToken = (token) => {
setAccessToken({ accessToken: token });
accessTokenRequest(token);
history.push('/Waiting')
history.push('/Waiting');
console.log(token);
};
//구글 로그인----------------------------------------------------------------
//구글 로그인----------------------------------------------------------------

const getAccessToken = async (authorizationCode) => {
// ! 구글 로그인
let resp = await axios.post('http://localhost:4000/googlelogin',
{
authorizationCode: authorizationCode,
},{
withCredentials: true
});
console.log(resp.data)
issueAccessToken(resp.data.accessToken)
let resp = await axios.post(
'http://localhost:4000/googlelogin',
{
authorizationCode: authorizationCode,
},
{
withCredentials: true,
}
);
console.log(resp.data);
issueAccessToken(resp.data.accessToken);
};
//구글 로그인 코드 받기--------------------------------
//구글 로그인 코드 받기--------------------------------
useEffect(() => {
const url = new URL(window.location.href);
const authorizationCode = url.searchParams.get('code');
Expand Down
44 changes: 22 additions & 22 deletions src/GamePages/InGame.js
Original file line number Diff line number Diff line change
Expand Up @@ -114,12 +114,12 @@ export default function InGame({ accessToken, isLogIn, loginCheck, userInfo }) {
const onMessageSubmit = (e) => {
e.preventDefault();
const { name, message } = state;
socket.emit('message', { name, message });
socket.emit('send message', name, message);
setState({ message: '', name });
};

const onTextChange = (e) => {
setState({ ...state, [e.target.name]: e.target.value });
setState({ ...state, message: e.target.value });
};

const startRound = () => {
Expand All @@ -143,15 +143,15 @@ export default function InGame({ accessToken, isLogIn, loginCheck, userInfo }) {

//! --------------------------method--------------------------

useEffect(() => {
socket.on('message', ({ name, message }) => {
if (chat.length > 4) {
return setChat([]);
}
return setChat([...chat, { name, message }]);
});
console.log('채팅이야!!!!!', chat);
}, [chat]);
// useEffect(() => {
// socket.on('message', ({ name, message }) => {
// if (chat.length > 4) {
// return setChat([]);
// }
// return setChat([...chat, { name, message }]);
// });
// console.log('채팅이야!!!!!', chat);
// }, [chat]);

useEffect(() => {
// * 문제가 선택되면 게임스타트와 문제를 서버에 보내줌
Expand Down Expand Up @@ -190,7 +190,7 @@ export default function InGame({ accessToken, isLogIn, loginCheck, userInfo }) {
socket.on('renew userlist', (list) => {
setUserlist([...list]);
});
});
}, []);

useEffect(() => {
// * 사용자 정보 소켓으로 불러 오기
Expand All @@ -205,16 +205,16 @@ export default function InGame({ accessToken, isLogIn, loginCheck, userInfo }) {
console.log('userlist', userlist);
}, []);

useEffect(() => {
// * 결과창이 열리고 서버에 라운드가 종료메세지 보냄 , 일정 시간이 지나면 결과창 닫히고 다시 게임 시작
const closeResult = setTimeout(() => {
setResultPopup(false);
setChat([]);
if (presenter.id === userInfo.id) {
startRound();
}
}, 3000);
}, [resultPopup]);
// useEffect(() => {
// // * 결과창이 열리고 서버에 라운드가 종료메세지 보냄 , 일정 시간이 지나면 결과창 닫히고 다시 게임 시작
// const closeResult = setTimeout(() => {
// setResultPopup(false);
// setChat([]);
// if (presenter.id === userInfo.id) {
// startRound();
// }
// }, 3000);
// }, [resultPopup]);

return (
<>
Expand Down
41 changes: 21 additions & 20 deletions src/MyPages/MyPage.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import Character1 from '../images/Character1.png';
import Character2 from '../images/Character2.png';
import Character3 from '../images/Character3.png';
import Character4 from '../images/Character4.png';
import axios from 'axios';

function MyPage({ accessToken, isLogIn, loginCheck, userInfo }) {
const PhotoData = [Character1, Character2, Character3, Character4];
Expand Down Expand Up @@ -40,25 +39,27 @@ function MyPage({ accessToken, isLogIn, loginCheck, userInfo }) {
}
};


const MyPageSaveData= async () =>{
const PhotoNum = PhotoData.findIndex(nowPhoto)
const SavePhoto = await axios.post(`http://localhost:4000/mypage/${id}/profile`,
{
authorization: accessToken,
new_profile: PhotoNum
},
{
headers: { 'Content-Type': 'application/json' },
Credentials: 'include',
})
const SaveComment = await axios.post(`http://localhost:4000/mypage/${id}/comment`,
{
authorization: accessToken,
Comment: PhotoNum
})
}

const MyPageSaveData = async () => {
const PhotoNum = PhotoData.findIndex(nowPhoto);
const SavePhoto = await axios.post(
`http://localhost:4000/mypage/${id}/profile`,
{
authorization: accessToken,
new_profile: PhotoNum,
},
{
headers: { 'Content-Type': 'application/json' },
Credentials: 'include',
}
);
const SaveComment = await axios.post(
`http://localhost:4000/mypage/${id}/comment`,
{
authorization: accessToken,
Comment: PhotoNum,
}
);
};

return (
<div>
Expand Down

0 comments on commit 0eed6d0

Please sign in to comment.