세션스토리지

client/src/Components/Chat.js

-import React, { useEffect, useState } from 'react';
+import React from 'react';
 import { Form, Button, Row } from 'react-bootstrap';
 
 
 function Chat(props) {
-  // const [username, setUsername] = useState('')
   let defaultname = sessionStorage.getItem('name');
-  // const [newName, setNewName] = useState({ username: '' });
-  // const [state, setState] = useState(false);
 
   function handleChange(e) {
     e.preventDefault()
@@ -18,26 +15,12 @@ function Chat(props) {
     props.sendMsg(e)
   }
 
-  // const saveChange = (e) => {
-  //   const { name, value } = e.target
-  //   setNewName({ ...newName, [name]: value })
-  // }
-
-  // const handleSubmit = (e) => {
-  //   e.preventDefault()
-  //   setState(true)
-  // }
 
   return (
 
     <div className="chat" id="chat" style={{ border: "2px solid", height: "300%", margin: "1%", borderColor: "#BDBDBD" }}>
       <Button variant="light" onClick={props.handleChatc} >{`<`}</Button>
 
-      <Form onSubmit={handleSubmit}>
-        <Form.Control name='newname' type='text' onChange={saveChange} />
-        <Button variant="primary" type="submit">전송</Button>
-      </Form>
-
       <h2>현재 {props.roomName} 입니다.</h2>
       {      props.chatmsg.map((value, index) => (
         <Row key={index} className='ml-3'>

client/src/Pages/ProfilePage.js

-import React, { useState, useEffect } from 'react';
-import ReactDOM from 'react-dom';
+import React, { useState, useEffect } from 'react'
 import Menu from '../Components/Menu';
-import { Image, Button, Container, Form, FormControl, Navbar, Nav, Row, Col, Dropdown, Carousel } from 'react-bootstrap';
-import { BrowserRouter as Router, Route, Redirect, Switch, Link } from 'react-router-dom';
+import { Image, Button, Container, Form, Row, Col, Dropdown } from 'react-bootstrap';
+import { BrowserRouter as Link } from 'react-router-dom';
 import axios from 'axios'
 
 import userdefault from '../Images/KakaoTalk_20201230_153151693.png'
@@ -27,7 +26,7 @@ function ProfilePage() {
 
 
     async function getLoginedUser() { //email로 db에서 찾아오기 ㅇㅇㅇㅇㅇ
-        const userid = localStorage.getItem('user')
+        const userid = sessionStorage.getItem('userId')
         const response = await axios.post(`/users/${userid}`, { 'email': userid })
         setUser(response.data)
     }
@@ -44,7 +43,7 @@ function ProfilePage() {
         setUser({ ...user, 'nickname': e.target.value })
     }
     async function handleNicksave() {
-        const userid = localStorage.getItem('user')
+        const userid = sessionStorage.getItem('userId')
         await axios.put(`/users/${userid}`, user)
     }
 
@@ -81,13 +80,7 @@ function ProfilePage() {
         }
     }
     useEffect(() => {
-        if (localStorage.getItem('user')) { //id뿐만아니라 토큰같은거를 확인 못하나 + 이런식으로 확인해도 되는것도 맞나
         getLoginedUser()
-        }
-        else {
-            alert("로그인 후 이용하세요")
-            window.location.href = '/login'
-        }
     }, [])
 
     return (

client/src/index.js

@@ -23,9 +23,9 @@ ReactDOM.render(
       <Route path="/login" component={LogInPage} />
       <Route path="/signup" component={SignUpPage} />
       <Route path="/profile" component={ProfilePage} />
-      {/* <PrivateRoute path="/profile">
+      <PrivateRoute path="/profile">
         <ProfilePage />
-      </PrivateRoute> */}
+      </PrivateRoute>
 
     </Switch>
   </Router>,