inflearn logo
강의

강의
N
챌린지

챌린지
멘토링

멘토링
N
클립

클립
로드맵

로드맵
지식공유

[리뉴얼] Node.js 교과서 - 기본부터 프로젝트 실습까지

router to router 데이터 전송 질문

해결된 질문

298

윤혁

작성한 질문수 3

1

안녕하세요.

router를 통해 json 형태로 시간 데이터를 가져 왔는데, 

다른 router에서 이 데이터를 사용하려면 어떻게 해야 할까요 ???

 

router nodejs mongodb mysql Sequelize

답변 1

0

제로초(조현영)

처음부터 /productBarChart 라우터로 보내세요. redirect하면서 쿼리스트링으로 데이터를 보내는 방법도 있긴 한데 추천드리지는 않습니다.

0

윤혁

음 저 데이터를 보내야 하는 라우터가 여러개인데,  쿼리스트링으로 보내는 방법을 채택해야 할까요 ? 

 

0

제로초(조현영)

라우터마다 전부다 저렇게 받으시면 됩니다. 왜 한번에 안 받으시나요?

0

윤혁

음 라우터 마다 받게 되면, 쿼리를 두번씩 실행하더라구요.

date-range 데이터를 못가져온 상태에서 1번, 가져온 상태에서 1번 실행되어서 Chart.js 통해 그래프가 안그려 지더라구요.

혹시 해결 방법이 있을까요 ?

Chart 업데이트가 안되어서 생각이 들었으나, 데이터 전달 부터가 안되어서 방안이 생각이 안나네요 ㅠ

 

0

윤혁

흐음.. 업데이트 쳐도 안되는거 같은데 어떻게 찾아봐야 할까요 .. 

// Set new default font family and font color to mimic Bootstrap's default styling
Chart.defaults.global.defaultFontFamily = '-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif';
Chart.defaults.global.defaultFontColor = '#292b2c';

//전역 변수 data
const data_product = [];
const product_label = [];

sendAjax();


// 그래프 출력 함수
function sendAjax(){
 
  fetch("/productBarChart",{
    method: "POST",
    headers: {
      "Content-Type": "application/json"
    },
  }).then((res)=>res.json())
    .then((res)=>{
      gclaer();
      // 데이터 저장
      const iam = res;
      console.log(data_product);
      console.log(product_label);
      // 라벨, 데이터 저장
      for(const ele in iam){
        if (iam[ele]._id == 'Simple') {
          product_label.push('test');
          data_product.push(Number(iam[ele].sum));
        }
        else{
          product_label.push(iam[ele]._id);
          data_product.push(Number(iam[ele].sum));
        }

      };
      myLineChart.update();
      console.log(data_product);
      // Bar Chart product
      const ctx = document.getElementById("productBarChart");
      const myLineChart = new Chart(ctx, {
       type: 'bar',
       data: {
          labels: product_label,
          datasets: [{
            label: "count",
            backgroundColor: "rgba(2,117,216,1)",
            borderColor: "rgba(2,117,216,1)",
            data: data_product,
         }],
        },
       options: {
          scales: {
           xAxes: [{
             time: {
               unit: 'month'
              },
              gridLines: {
              display: false
              },
              ticks: {
                maxTicksLimit: 6
              }
            }],
            yAxes: [{
              ticks: {
                min: 0,
                max: Math.max(...data_product)+50,
                maxTicksLimit: 5
              },
              gridLines: {
                display: true
              }
            }],
          },
          legend: {
            display: false
          }
        }
      });
      myLineChart.update();
  });
 
}



0

제로초(조현영)

데이터를 잘 못 가져왔을 때와 제대로 가져왔을 때를 구분해서 화면을 그리시면 됩니다.

백엔드에서도 start와 end가 있을 때와 없을 때 다른 데이터를 주어서 프론트가 구분할 수 있게 하면 되고요.

0

윤혁

음 백엔드랑 프론트에 if문을 통해 구분을 하였는데 브라우저 상에서

먼저 호출하는 애가 대기중이네요 .. 데이터를 안받아 왔을 땐, 200을 반환하게 했는데 적용이 왜 안될까요 .. ? 

0

제로초(조현영)

따로 에러메시지는 없나요? 서버쪽에서든 브라우저에서든요.

0

윤혁

별도 에러메시지가 안떨어 집니다;

0

윤혁

fetch로 post, get 각각 불러 오던것을 post쪽에서 chart까지 그리게 해서 수정 했습니다..; 코드가 많이 지저분해 보이는데 이걸 분리 시키는 걸 생각해봐야 겠네요. 감사합니다.

리눅스 노드 설치시 패키지

0

172

0

socket.js 에서 referer로부터 roomId를 가져올 때

0

926

3

스트리밍 방식으로 대용량 파일 업로드 & 다운로드 관련 질문

0

2297

2

a[title] 질문드립니다

0

386

1

리뉴얼 강의 및 공부 방법

0

589

1

jwt decode

0

1136

1

node.js 교과서 3판 질문드립니다

0

396

1

passport와 jwt

0

438

1

리뉴얼 강의

0

427

2

혹시 Node.js 교과서 3판 이북은 언제 나오나요?

0

359

1

몽고디비 사용자도 MYSQL부분을 들어야 하나요???

0

488

1

sql 쿼리 로그는 어떤 모듈이 작성하나요?

0

511

2

nunjucks res.render('error'); 작동을 안합니다.

0

518

1

질문있습니다.

0

348

1

multer 한글 파일 업로드시 파일명이 깨져요.

1

3542

1

수업자료는 어디있나요?

0

374

1

질문 있습니디

0

244

1

multer 사용시 file 외 name값은 못받나용?

0

428

1

코드 중복 부분 질문드립니다.

0

303

1

api 만드는 이유 질문드립니다.

0

292

1

Strategy의 done에 대해 질문드립니다.

0

373

1

안녕하세요 fs 권한 관련 질문드립니다

0

455

1

시퀄라이즈 연결질문...

0

510

2

res.setHeader vs res.cookie

0

1797

3