상대경로로 파일을 다운로드 하는 로직을 프론트쪽에 넣는게 좋을까요 백엔드에 넣는게 좋을까요?


(Jaewoo Nam) #1

reactJS - nodeJS 프로젝트 중인 초보 개발자입니다.
파일 path를 파라미터로 넣어서 버튼 클릭시 서버에 업로드해두었던 csv파일이 다운로드 되게하려는데
크롬에서는 잘 동작하지만, 사파리, IE 환경에서 에러가 떠서 고민입니다…
또한 이게 프론트쪽에 로직을 두어서 생긴건지도 모르겠구요,
해결 방법 조언좀 구하고싶습니다.ㅠ

// call
const url = ${ process.env.PUBLIC_URL }/files/sample_files/sample-simulations.csv

download(url)



const download = (data, filename, mime) => {
    const blob = new Blob([data], { type: mime || 'application/octet-stream' })
    if (typeof window.navigator.msSaveBlob !== 'undefined') {
        window.navigator.msSaveBlob(filename)
    } else {
    const tempLink = document.createElement('a')
    tempLink.style.display = 'none'
    tempLink.href = data
    document.body.appendChild(tempLink)
    tempLink.click()
    document.body.removeChild(tempLink)
       }

}


(InGrowth) #2

말로는 이해가 어렵고 코드를 같이 올려주셔야 할 것 같습니다.


(Jaewoo Nam) #4

죄송합니다 코드도 함께 넣었습니다.


#5

서버의 파일 저장 경로가 노출되면 어떤식으로든 후벼서 자기꺼 아닌 파일을 가져가려는 시도를 하는 인간이 꼭 생깁니다. 권한에 따라 접근을 제한할 필요가 없는 파일들이라면 아무렇게나 해도 좋겠지만 그렇지 않다면 반드시 서버에서 처리하셔야 합니다.


(Jaewoo Nam) #6

조언 감사합니다. 전혀 몰랐네요; 이번에는 포멧갖춰진 CSV 샘플파일 다운로드라서 프론트쪽에서도 괜찮겠지만 다음부터는 주의해야겠네요


(Jong Chan Park) #7

window.open 함수로 처리하는게 가장 간편하지 않을까 싶습니다.