WEB 서비스에서 사용
아래 함수를 사용해서 구현하시면 편합니다.
// elm : 클릭할 수 있는 html element 예를 들면, 파일첨부버튼
// key : api-key
// callback : url을 받아올때 실행되는 함수, 사용자에게 표시하는 로직을 구현하면 됨
// 예) makeFilekiwiButton( document.getElementById("btn"), "keykeyekyefwefwefsfadf"
// , url=>alert(url));
function makeFilekiwiButton(elm, key, callback) {
elm.addEventListener("click", function() {
var w = 500;
var h = 500;
var dualScreenLeft = window.screenLeft != undefined ? window.screenLeft : screen.left;
var dualScreenTop = window.screenTop != undefined ? window.screenTop : screen.top;
var width = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth ? document.documentElement.clientWidth : screen.width;
var height = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight ? document.documentElement.clientHeight : screen.height;
var left = ((width / 2) - (w / 2)) + dualScreenLeft;
var top = ((height / 2) - (h / 2)) + dualScreenTop;
var win = window.open("", "_blank", 'menubar=yes,location=yes,resizable=yes,scrollbars=yes, width=' + w + ', height=' + h + ', top=' + top + ', left=' + left);
const url = 'https://api.file.kiwi/v1/webfolder';
const options = {
method: 'POST',
// mode:'cors',
headers: {
//Accept: 'application/json',
'Content-Type': 'application/json',
'x-api-key': key
},
body: '{}'
};
fetch(url, options)
.then(res => res.json())
.then(json => {
var url = json.url;
callback(url);
win.document.write("파일을 업로드할 웹폴더가 생성중입니다. 잠시만 기다려주세요.");
win.document.write("<","script",">");
win.document.write('alert("* 파일업로드는 10분내에 시작되야 합니다.(그때까지 완료될 필요는 없음)\\n* 업로드중에는 현재창을 닫지 말고 유지해야 하지만,\\n* 링크전달을 기다릴 필요는 없습니다. 웹폴더 링크는 바로 전달해도 됩니다.");');
win.document.write("location.href='" + url + "'");
win.document.write("<","/script",">");
//win.location.href = url;
if (window.focus) {
win.focus();
}
})
.catch(err => console.error('error:' + err));
});
};

1.채팅창에 대용량 파일첨부 기능을 추가하는 예제

하단 파일첨부 버튼을 클릭하세요.

2. 게시판에 대용량 파일 첨부 기능 추가

Copy link
On this page
1.채팅창에 대용량 파일첨부 기능을 추가하는 예제
2. 게시판에 대용량 파일 첨부 기능 추가