로직이 떠오르지 않습니다...

where 조건문을 서버쪽에서 사용합니다!! 현재 코드는 다음과 같습니다 서버쪽 코드는 전체 코드가 아닌 조회로직에 사용되는 코드들로 올려보았습니다! 문제점이 메인페이지에서 사용자의 입력값을 셀렉트하고 검색을 눌렀을 때, 해당 조건에 맞는 방이 출력되는 것이 아닌 디비에 있는 모든 방들이 출력이 됩니다. F12버튼을 눌러 콘솔창을 확인해본 결과 디비에 있는 모든 방들이 찍히는 것이 지금의 문제점 같습니다. window.location.href = "/search"; 하지만 해당 코드가 문제인건지 search 페이지에서 이 코드를 주석처리를 하고 사용자의 입력값을 셀렉하고 검색버튼을 눌렀을 땐 사용자가 입력한 내용들이 콘솔에 찍힙니다. 서버상에 찍히는 콘솔입니다. Executing (default): SELECT `id`, `address1`, `address2`, `address3`, `address4`, `datein`, `dateout`, `roomtype`, `people`, `price`, `description`, `imageurl` FROM `Rooms` AS `Rooms` WHERE `Rooms`.`address1` = '인천' AND `Rooms`.`address2` = '미추홀구' AND `Rooms`.`datein` = '2021-04-25' AND `Rooms`.`dateout` = '2021-04-28' AND `Rooms`.`roomtype` = '2' AND `Rooms`.`people` = '2' ORDER BY `Rooms`.`createdAt` DESC; { address1: '인천', address2: '미추홀구', datein: '2021-04-25', dateout: '2021-04-28', roomtype: '2', people: '2' } Rooms : [ { id: 17, address1: '인천', address2: '미추홀구', address3: '용현동', address4: '용현동 12-345', datein: '2021-04-25', dateout: '2021-04-28', roomtype: '2', people: '2', price: 50000, description: '야경이 멋진 방', imageurl: '/roomImages/s1.png' } 단, 이 코드를 주석으로 풀었을 때는 검색버튼을 누르는 동시에 콘솔에는 사용자가 입력한 값이 찍히지 않고 디비에 있는 모든 방들이 찍히고 화면에 출력됩니다. 메인페이지에서 사용자의 입력값을 셀렉하고 검색버튼을 눌렀을 때 해당 콘솔이 서버쪽에 찍힙니다. 서버에 찍힌 콘솔은 쿼리를 하나도 가져오지 못하는 것을 확인하였고 간단한 테스트를 진행해봤습니다. location.href = "/search?addr1=" + values.addr1 + "&addr2=" + values.addr2; 이렇게 하였을 때 값을 제대로 전달해주지 않았더라면 addr1=undefined이 찍혀야지 맞지만 유저가 입력한 값 그대로 URL에 송출이 됩니다. 하지만 서버 콘솔에는 유저가 입력한 값은 하나도 나오지 않습니다. {} Executing (default): SELECT `id`, `address1`, `address2`, `address3`, `address4`, `datein`, `dateout`, `roomtype`, `people`, `price`, `description`, `imageurl` FROM `Rooms` AS `Rooms` ORDER BY `Rooms`.`createdAt` DESC; Rooms : [ { id: 30, address1: '인천', address2: '미추홀구', address3: '용현동', address4: '백호오피스텔', datein: '2021-04-12', dateout: '2021-04-13', roomtype: '2', people: '2', price: 80000, description: '문화의 거리 7분거리 최적의 오피스텔입니다.', imageurl: '/roomImages/s9.png' }, { id: 25, address1: '인천', address2: '부평구', address3: '용현동', address4: 'State오피스텔', datein: '2021-04-27', dateout: '2021-04-28', roomtype: '2', people: '2', price: 80000, description: '문화의 거리 8분거리 최적의 오피스텔입니다.', imageurl: '/roomImages/s8.png' }, { id: 24, address1: '인천', address2: '동구', address3: '용현동', address4: '베스트오피스텔', datein: '2021-04-27', dateout: '2021-04-28', roomtype: '2', people: '2', price: 80000, description: '문화의 거리 5분거리 최적의 오피스텔입니다.', imageurl: '/roomImages/s7.png' }, { id: 23, address1: '인천', address2: '연수구', address3: '용현동', address4: '케이오피스텔', datein: '2021-04-29', dateout: '2021-04-30', roomtype: '2', people: '2', price: 80000, description: '문화의 거리 3분거리 최적의 오피스텔입니다.', imageurl: '/roomImages/s6.png' }, { id: 22, address1: '인천', address2: '서구', address3: '용현동', address4: '제이오피스텔', datein: '2021-04-28', dateout: '2021-04-29', roomtype: '2', people: '2', price: 80000, description: '인하대역 2번 출구 10분거리 최적의 오피스텔입니다.', imageurl: '/roomImages/s5.png' }, { id: 21, address1: '인천', address2: '부평구', address3: '용현동', address4: '마로오피스텔', datein: '2021-04-27', dateout: '2021-04-28', roomtype: '2', people: '2', price: 80000, description: '인하대역 2번 출구 15분거리 최적의 오피스텔입니다.', imageurl: '/roomImages/s4.png' }, { id: 20, address1: '인천', address2: '중구', address3: '용현동', address4: '헬마빌오피스텔', datein: '2021-04-27', dateout: '2021-04-28', roomtype: '2', people: '2', price: 80000, description: '논현역 2번 출구 3분거리 최적의 오피스텔입니다.', imageurl: '/roomImages/s3.png' }, { id: 19, address1: '인천', address2: '남동구', address3: '문학동', address4: '문학동 77-777', datein: '2021-04-26', dateout: '2021-04-28', roomtype: '2', people: '2', price: 30000, description: 'ㅇㅁㄴㅇㅁㄴ', imageurl: '/roomImages/s2.png' }, { id: 17, address1: '인천', address2: '미추홀구', address3: '용현동', address4: '용현동 12-345', datein: '2021-04-25', dateout: '2021-04-28', roomtype: '2', people: '2', price: 50000, description: '야경이 멋진 방', imageurl: '/roomImages/s1.png' } const express = require("express"); const cors = require("cors"); const app = express(); const models = require("./models"); const port = 8090; const multer = require("multer"); const addroom = multer({ storage: multer.diskStorage({ destination: function (req, file, cb) { cb(null, "addroom/"); // 이미지 저장 경로 }, filename: function (req, file, cb) { cb(null, file.originalname); // 이미지 파일 이름 설정 }, }), }); app.use(express.json()); app.use(cors()); app.use("/addroom", express.static("addroom")); app.get("/search", (req, res) => { console.log(req.body); //console.log(req.query); // 사용자의 입력을 바탕으로 검색 기능 필터 로직 const whereOption = {}; if (req.query.address1 && typeof req.query.address1 === "string") { whereOption["address1"] = req.query.address1; } if (req.query.address2 && typeof req.query.address2 === "string") { whereOption["address2"] = req.query.address2; } if (req.query.datein && typeof req.query.datein === "string") { whereOption["datein"] = req.query.datein; } if (req.query.dateout && typeof req.query.dateout === "string") { whereOption["dateout"] = req.query.dateout; } if (req.query.roomtype && typeof req.query.roomtype === "string") { whereOption["roomtype"] = req.query.roomtype; } if (req.query.people && typeof req.query.people === "string") { whereOption["people"] = req.query.people; } models.Rooms.findAll({ order: [["createdAt", "DESC"]], // 방 조회 정렬 (오름차순) 로직 -> 최근에 등록한 방이 먼저 보이게끔 설정하기 위해서 attributes: [ "id", "address1", "address2", "address3", "address4", "datein", "dateout", "roomtype", "people", "price", "description", "imageurl", ], // 가져오고 싶은 데이터만 받아올 수 있는 로직 where: { ...whereOption, }, raw: true, }) .then((result) => { console.log("Rooms : ", result); res.send({ Rooms: result, }); }) .catch((error) => { console.error(error); res.status(400).send("에러 발생"); }); }); app.listen(port, () => { console.log("airtrace 서버가 돌아가고 있습니다"); models.sequelize .sync() .then(() => { console.log("DB 연결 성공!"); }) .catch((err) => { console.error(err); console.log("DB 연결 에러"); process.exit(); }); }); import "./index.css"; import { Link } from "react-router-dom"; import { Button, Form } from "antd"; import { API_URL } from "../config/constants"; import axios from "axios"; function MainPage() { const onSubmit = (values) => { console.log(values); axios .post(`${API_URL}/search`, { //서버통신 params: { address1: values.addr1, address2: values.addr2, datein: values.datein, dateout: values.dateout, roomtype: values.roomtype, people: values.people, price: values.price, imageurl: values.imageurl, }, }) .then((result) => { console.log(result); }) .catch(function (error) { console.error(error); }); location.href = "/search"; }; return ( div> div id="header"> div id="logo"> Link to="/"> img src="../images/logo.png" id="logo" alt="logo" /> Link> div> Form className="formcss" name="방검색" onFinish={onSubmit} > div id="searchbox"> div> h4>도시선택h4> Form.Item name="addr1"> select className="searchboxselect1"> option>시option> option value="서울">서울option> option value="인천">인천option> option value="경기">경기option> option value="강원">강원option> option value="대전">대전option> option value="대구">대구option> option value="충청">충청option> option value="전라">전라option> option value="경상">경상option> option value="제주">제주option> select> Form.Item> div> div> h4>구선택h4> Form.Item name="addr2"> select className="searchboxselect2"> option>구option> option value="남동구">남동구option> option value="미추홀구">미추홀구option> option value="부평구">부평구option> option value="중구">중구option> option value="서구">서구option> option value="동구">동구option> option value="연수구">연수구option> select> Form.Item> div> div> h4>체크인 날짜h4> Form.Item name="checkIn"> input className="searchboxcheckin" type="date" /> Form.Item> div> div> h4>체크아웃 날짜h4> Form.Item name="checkOut"> input className="searchboxcheckout" type="date" /> Form.Item> div> div> h4>방 타입h4> Form.Item name="roomtype"> select className="searchboxroomtype"> option>방타입option> option value="1">1룸option> option value="2">2룸option> option value="3">3룸option> select> Form.Item> div> div> h4>방 인원h4> Form.Item name="people"> select className="searchboxpeople"> option>인원option> option value="1">1명option> option value="2">2명option> option value="3">3명option> select> Form.Item> div> div> div id="searchclick"> Form.Item> Button id="searchbutton" size="large" htmlType="submit"> 검색 Button> Form.Item> div> Form> div className="joinbutton"> Link to="/login"> input type="button" id="login" value="로그인" /> Link> Link to="/members"> input type="button" id="signup" value="회원가입" /> Link> div> div> div id="main"> div id="maindescription"> img id="mainimg" src="../images/main2.jpg" /> div id="maincaption"> h1 className="mainh1">도시별 바로가기h1> div> div id="mainboxtop"> div id="seoul"> button>서울button> div> div id="incheon"> button>인천button> div> div id="gyunggi"> button>경기button> div> div id="gangwon"> button>강원button> div> div> div id="mainboxbottom"> div id="chungchung"> button>충청button> div> div id="junra"> button>전라button> div> div id="gyungsang"> button>경상button> div> div id="jeju"> button>제주button> div> div> div id="mainbottomimg">div> div> div> div> ); } export default MainPage; import "./index.css"; import { Link } from "react-router-dom"; import { Button, Form } from "antd"; import { API_URL } from "../config/constants"; import axios from "axios"; import React from "react"; import ReactDOM from "react-dom"; import { useState, useEffect } from "react"; function searchPage() { const [rooms, setRooms] = useState([]); useEffect(function () { axios .get(`${API_URL}/search`) .then(function (result) { setRooms( result.data.Rooms.map((data) => { return data; }) ); }) .catch(function (error) { console.error("에러 발생 : ", error); }); }, []); const onSubmit = (values) => { //console.log("hi!"); console.log(values); axios .get(`${API_URL}/`, { params: { address1: values.addr1, address2: values.addr2, datein: values.datein, dateout: values.dateout, roomtype: values.roomtype, people: values.people, price: values.price, imageurl: values.imageurl, }, //서버통신 }) .then((result) => { console.log(result); }) .catch(function (error) { console.error(error); }); // window.location.href = // "/search?addr1=" + values.addr1 + "&addr2=" + values.addr2; }; return ( div> div id="header"> div id="logo"> Link to="/"> img src="../images/logo.png" id="logo" alt="logo" /> Link> div> Form className="formcss" name="방검색" onFinish={onSubmit}> div id="searchbox"> div> h4>도시선택h4> Form.Item name="addr1"> select className="searchboxselect1"> option>시option> option value="서울">서울option> option value="인천">인천option> option value="경기">경기option> option value="강원">강원option> option value="대전">대전option> option value="대구">대구option> option value="충청">충청option> option value="전라">전라option> option value="경상">경상option> option value="제주">제주option> select> Form.Item> div> div> h4>구선택h4> Form.Item name="addr2"> select className="searchboxselect2"> option>구option> option value="남동구">남동구option> option value="미추홀구">미추홀구option> option value="부평구">부평구option> option value="중구">중구option> option value="서구">서구option> option value="동구">동구option> option value="연수구">연수구option> select> Form.Item> div> div> h4>체크인 날짜h4> Form.Item name="datein"> input className="searchboxcheckin" type="date" /> Form.Item> div> div> h4>체크아웃 날짜h4> Form.Item name="dateout"> input className="searchboxcheckout" type="date" /> Form.Item> div> div> h4>방 타입h4> Form.Item name="roomtype"> select className="searchboxroomtype"> option>방타입option> option value="1">1룸option> option value="2">2룸option> option value="3">3룸option> select> Form.Item> div> div> h4>방 인원h4> Form.Item name="people"> select className="searchboxpeople"> option>인원option> option value="1">1명option> option value="2">2명option> option value="3">3명option> select> Form.Item> div> div> div id="searchclick"> Form.Item> Button id="searchbutton" size="large" htmlType="submit"> 검색 Button> Form.Item> div> Form> div className="joinbutton"> Link to="/hostroom"> input type="button" id="login" value="방관리" /> Link> Link to="/cusroom"> input type="button" id="signup" value="예약관리" /> Link> div> div> div className="roomListBox"> {rooms.map((room, index) => { console.log(room); return ( div className="roomBox" key={index}> Link className="room-link" to={`/reservation/${room.id}`}> img className="roomBoxImg" src={room.imageurl} /> div className="roomInfo"> strong> 주소 : {room.address1} {room.address2} {room.address3} strong> p>가격 : {room.price}원 (1박)p> p>기준 인원 : {room.people}명p> div> Link> div> ); })} div> div> ); } export default searchPage;

로직이 떠오르지 않습니다...

그러면 조건값은 항상 달라지니 이런 식으로 처리를 해주면 된다는 말씀이신가요? 그리고 서버에서는 이 쿼리 스트링의 값을 어떤 식으로 처리하게 되나요? axios.get('https://apiserver.com', { params: { number: 유저의 입력값 date : 유저의 입력값 } })

tensorflow 설치 오류 질문 드립니다.

그랩님??

tensorflow 설치 오류 질문 드립니다.

현재 npm install --global windows-build-tools은 관리자 권한으로 success 창까지 나온 걸 확인하고 다시 VS로 들어와서 npm install @tensorflow/tfjs-node을 실행한 결과 npm ERR! @tensorflow/tfjs-node@3.2.0 install: `node scripts/install.js` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the @tensorflow/tfjs-node@3.2.0 install script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\ASROCK\AppData\Roaming\npm-cache\_logs\2021-03-05T04_15_20_158Z-debug.log 오류가 발생하였고 파이썬은 지금 2.7버전 하나만 깔린 상태입니다.....

tensorflow 설치 오류 질문 드립니다.

제가 지금은 확인할 수 없는 상황이라 3.4에 확인 해보겠습니다ㅜㅜㅜㅜ얼른 다음 강의를 듣고 싶어요ㅜㅜㅜ