Merge branch 'refs/heads/dev' into design
psy
6 months ago
commit
864bc42783
@ -0,0 +1,30 @@
|
|||||||
|
package cokr.xit.adds.nims.web;
|
||||||
|
|
||||||
|
import org.springframework.beans.factory.annotation.Value;
|
||||||
|
import org.springframework.stereotype.Controller;
|
||||||
|
import org.springframework.web.bind.annotation.RequestMapping;
|
||||||
|
import org.springframework.web.servlet.ModelAndView;
|
||||||
|
|
||||||
|
import cokr.xit.foundation.web.AbstractController;
|
||||||
|
import lombok.RequiredArgsConstructor;
|
||||||
|
|
||||||
|
@RequiredArgsConstructor
|
||||||
|
@Controller
|
||||||
|
@RequestMapping(
|
||||||
|
name = "Nims 관리",
|
||||||
|
value = {"/adds/nims"}
|
||||||
|
)
|
||||||
|
public class TestController extends AbstractController {
|
||||||
|
@Value("${app.api.host:}")
|
||||||
|
private String apiHost;
|
||||||
|
|
||||||
|
@RequestMapping(
|
||||||
|
name = "Nims 메인",
|
||||||
|
value = {"/barcode/main.do"}
|
||||||
|
)
|
||||||
|
public ModelAndView main() {
|
||||||
|
ModelAndView mav = new ModelAndView();
|
||||||
|
mav.setViewName("adds/nims/barcode-read");
|
||||||
|
return mav.addObject("apiHost", apiHost);
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,113 @@
|
|||||||
|
package cokr.xit.foundation.boot;
|
||||||
|
|
||||||
|
import java.text.SimpleDateFormat;
|
||||||
|
import java.util.List;
|
||||||
|
import java.util.Map;
|
||||||
|
import java.util.Set;
|
||||||
|
import java.util.stream.Collectors;
|
||||||
|
|
||||||
|
import org.egovframe.rte.fdl.cmmn.trace.LeaveaTrace;
|
||||||
|
import org.egovframe.rte.fdl.property.impl.EgovPropertyServiceImpl;
|
||||||
|
import org.springframework.context.annotation.Bean;
|
||||||
|
import org.springframework.context.annotation.ComponentScan;
|
||||||
|
import org.springframework.context.annotation.Configuration;
|
||||||
|
import org.springframework.context.support.ReloadableResourceBundleMessageSource;
|
||||||
|
import org.springframework.core.env.Environment;
|
||||||
|
import org.springframework.util.AntPathMatcher;
|
||||||
|
|
||||||
|
import com.fasterxml.jackson.core.JsonParser.Feature;
|
||||||
|
import com.fasterxml.jackson.databind.ObjectMapper;
|
||||||
|
|
||||||
|
/**전자정부 프레임웤과 xit foundation을 사용하는 애플리케이션의 공통 Bean들을 설정한다.
|
||||||
|
* @author mjkhan
|
||||||
|
*/
|
||||||
|
@Configuration
|
||||||
|
@ComponentScan(basePackages = "cokr.xit")
|
||||||
|
public class CommonConfig {
|
||||||
|
final Environment env;
|
||||||
|
|
||||||
|
public CommonConfig(Environment env) {
|
||||||
|
this.env = env;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**AntPathMatcher를 반환한다.
|
||||||
|
* @return AntPathMatcher
|
||||||
|
*/
|
||||||
|
@Bean
|
||||||
|
public AntPathMatcher antPathMatcher() {
|
||||||
|
return new AntPathMatcher();
|
||||||
|
}
|
||||||
|
|
||||||
|
/**ObjectMapper를 반환한다.
|
||||||
|
* @return ObjectMapper
|
||||||
|
*/
|
||||||
|
@Bean
|
||||||
|
public ObjectMapper objectMapper() {
|
||||||
|
ObjectMapper bean = new ObjectMapper();
|
||||||
|
bean.setDateFormat(new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"));
|
||||||
|
bean.configure(Feature.ALLOW_COMMENTS, true);
|
||||||
|
return bean;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**LeaveaTrace를 반환한다.
|
||||||
|
* @return LeaveaTrace
|
||||||
|
*/
|
||||||
|
@Bean
|
||||||
|
public LeaveaTrace leaveaTrace() {
|
||||||
|
return new LeaveaTrace();
|
||||||
|
}
|
||||||
|
|
||||||
|
//private Yml yml = new Yml("application.yml", "application.yml", env);
|
||||||
|
@Bean
|
||||||
|
public Yml yml() {
|
||||||
|
return new Yml("application.yml", "application.yml", env);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**application.yml의 설정 내용을 읽어 MessageSource Bean을 설정하여 반환한다.
|
||||||
|
* <pre><code> messageSource:
|
||||||
|
* basenames:
|
||||||
|
* - classpath:message/message-common
|
||||||
|
* - classpath:message/authentication-message
|
||||||
|
* - classpath:org/egovframe/rte/fdl/property/messages/properties</code></pre>
|
||||||
|
* @return ReloadableResourceBundleMessageSource
|
||||||
|
*/
|
||||||
|
@Bean
|
||||||
|
public ReloadableResourceBundleMessageSource messageSource() {
|
||||||
|
ReloadableResourceBundleMessageSource bean = new ReloadableResourceBundleMessageSource();
|
||||||
|
bean.setDefaultEncoding("UTF-8");
|
||||||
|
bean.setCacheSeconds(60);
|
||||||
|
|
||||||
|
List<String> basenames = yml().getValues("messageSource.basenames");
|
||||||
|
if (!basenames.isEmpty())
|
||||||
|
bean.setBasenames(basenames.toArray(new String[basenames.size()]));
|
||||||
|
|
||||||
|
return bean;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**application.yml의 설정 내용을 읽어 EgovPropertyServiceImpl Bean을 설정하여 반환한다.
|
||||||
|
* <pre><code> propertyService:
|
||||||
|
* properties: # 인라인 프로퍼티가 있을 경우
|
||||||
|
* - property0: value0
|
||||||
|
* - property1: value1
|
||||||
|
* extFileName: #외부 프로퍼티 파일이 있을 경우
|
||||||
|
* - encoding: UTF-8
|
||||||
|
* filename: classpath*:properties/your-file-01.properties
|
||||||
|
* - encoding: UTF-8
|
||||||
|
* filename: classpath*:properties/your-file-02.properties</code></pre>
|
||||||
|
* @return EgovPropertyServiceImpl
|
||||||
|
*/
|
||||||
|
@Bean
|
||||||
|
public EgovPropertyServiceImpl propertyService() {
|
||||||
|
EgovPropertyServiceImpl bean = new EgovPropertyServiceImpl();
|
||||||
|
|
||||||
|
Map<String, String> properties = yml().getMap("propertyService.properties");
|
||||||
|
if (!properties.isEmpty())
|
||||||
|
bean.setProperties(properties);
|
||||||
|
|
||||||
|
Set<?> filenames = yml().getMaps("propertyService.extFileName").stream().collect(Collectors.toSet());
|
||||||
|
if (!filenames.isEmpty())
|
||||||
|
bean.setExtFileName(filenames);
|
||||||
|
|
||||||
|
return bean;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,148 @@
|
|||||||
|
package cokr.xit.foundation.boot;
|
||||||
|
|
||||||
|
import java.util.Collections;
|
||||||
|
import java.util.LinkedHashMap;
|
||||||
|
import java.util.List;
|
||||||
|
import java.util.Map;
|
||||||
|
import java.util.stream.Collectors;
|
||||||
|
|
||||||
|
import org.springframework.boot.env.YamlPropertySourceLoader;
|
||||||
|
import org.springframework.core.env.Environment;
|
||||||
|
import org.springframework.core.env.PropertySource;
|
||||||
|
import org.springframework.core.io.ClassPathResource;
|
||||||
|
|
||||||
|
import cokr.xit.foundation.Assert;
|
||||||
|
|
||||||
|
/**yml 파일 내용을 프로퍼티 형식으로 읽기를 지원하는 유틸리티.
|
||||||
|
* <p>
|
||||||
|
* @author mjkhan
|
||||||
|
*/
|
||||||
|
public class Yml {
|
||||||
|
private Map<String, ?> source;
|
||||||
|
private final Environment env;
|
||||||
|
|
||||||
|
/**새 Yml을 생성한다.
|
||||||
|
* @param rootName 프로퍼티 소스의 루트 이름
|
||||||
|
* @param path 클래스패스에서 yml 파일의 경로
|
||||||
|
*/
|
||||||
|
public Yml(String rootName, String path, Environment environment) {
|
||||||
|
this.env = environment;
|
||||||
|
load(rootName, path);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**지정하는 yml 파일의 프로퍼티들을 읽어들인다.
|
||||||
|
* @param rootName 프로퍼티 소스의 루트 이름
|
||||||
|
* @param path 클래스패스에서 yml 파일의 경로
|
||||||
|
* @return 현재 Yml
|
||||||
|
*/
|
||||||
|
public Yml load(String rootName, String path) {
|
||||||
|
source = null;
|
||||||
|
try {
|
||||||
|
List<PropertySource<?>> sources = new YamlPropertySourceLoader()
|
||||||
|
.load(rootName, new ClassPathResource(path));
|
||||||
|
if (!sources.isEmpty()) {
|
||||||
|
source = (Map<String, ?>)sources.get(0).getSource();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Spring-boot profile별 설정이 있는 경우 처리
|
||||||
|
String[] activeProfiles = env.getActiveProfiles();
|
||||||
|
for (String profile : activeProfiles) {
|
||||||
|
PropertySource<?> profileSource = sources.stream()
|
||||||
|
.filter(ps -> ps.getName().equals(profile))
|
||||||
|
.findFirst()
|
||||||
|
.orElse(null); // default to null if no matching profile is found
|
||||||
|
|
||||||
|
if (profileSource != null) {
|
||||||
|
// Merge the properties of the profile into the source map
|
||||||
|
((Map<String, Object>)source).putAll((Map<String, ?>)profileSource.getSource());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return this;
|
||||||
|
} catch (Exception e) {
|
||||||
|
throw Assert.runtimeException(e);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**지정하는 프로퍼티(아래 참고)의 값을 반환한다.
|
||||||
|
* @param key 키. 프로퍼티 이름
|
||||||
|
* <pre><code> spring:
|
||||||
|
* application:
|
||||||
|
* name: my-application
|
||||||
|
* </code></pre>
|
||||||
|
* @return 지정하는 키의 프로퍼티 값
|
||||||
|
*/
|
||||||
|
public String getValue(String key) {
|
||||||
|
if (source == null) return "";
|
||||||
|
|
||||||
|
Object obj = source.get(key);
|
||||||
|
return obj != null ? obj.toString() : "";
|
||||||
|
}
|
||||||
|
|
||||||
|
/**지정하는 문자열로 시작하는 프로퍼티(아래 참고) 값들을 반환한다.
|
||||||
|
* <pre><code> list:
|
||||||
|
* - item-0
|
||||||
|
* - item-2
|
||||||
|
* - item-3</code></pre>
|
||||||
|
* @param prefix 프로퍼티 접두어
|
||||||
|
* @return 지정하는 문자열로 시작하는 프로퍼티 값
|
||||||
|
*/
|
||||||
|
public List<String> getValues(String prefix) {
|
||||||
|
if (source == null) return Collections.emptyList();
|
||||||
|
|
||||||
|
return getPrefixed(prefix).stream()
|
||||||
|
.map(entry -> entry.getValue().toString())
|
||||||
|
.collect(Collectors.toList());
|
||||||
|
}
|
||||||
|
|
||||||
|
private List<Map.Entry<String, ?>> getPrefixed(String prefix) {
|
||||||
|
return source.entrySet().stream()
|
||||||
|
.filter(entry -> entry.getKey().startsWith(prefix))
|
||||||
|
.collect(Collectors.toList());
|
||||||
|
}
|
||||||
|
|
||||||
|
/**지정하는 문자열로 시작하는 프로퍼티(아래 참고) 값들을 Map으로 반환한다.
|
||||||
|
* <pre><code> parent:
|
||||||
|
* - property-0: value-0
|
||||||
|
* - property-1: value-1
|
||||||
|
* - property-2: value-2</code></pre>
|
||||||
|
* @param prefix 프로퍼티 접두어
|
||||||
|
* @return 지정하는 문자열로 시작하는 프로퍼티로 된 Map
|
||||||
|
*/
|
||||||
|
public Map<String, String> getMap(String prefix) {
|
||||||
|
if (source == null) return Collections.emptyMap();
|
||||||
|
|
||||||
|
LinkedHashMap<String, String> map = new LinkedHashMap<>();
|
||||||
|
getPrefixed(prefix).stream().forEach(entry -> putTo(map, entry));
|
||||||
|
|
||||||
|
return map;
|
||||||
|
}
|
||||||
|
|
||||||
|
private void putTo(LinkedHashMap<String, String> map, Map.Entry<String, ?> entry) {
|
||||||
|
String key = entry.getKey();
|
||||||
|
key = key.substring(key.lastIndexOf(".") + 1);
|
||||||
|
String val = entry.getValue().toString();
|
||||||
|
map.put(key, val);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**지정하는 문자열로 시작하는 프로퍼티들(아래 참고)을 Map 목록으로 반환한다.
|
||||||
|
* <pre><code> parent:
|
||||||
|
* - property-0: value-0.0
|
||||||
|
* property-1: value-0.1
|
||||||
|
* - property-0: value-1.0
|
||||||
|
* property-1: value-1.1</code></pre>
|
||||||
|
* @param prefix 프로퍼티 접두어
|
||||||
|
* @return 지정하는 문자열로 시작하는 프로퍼티들의 Map 목록
|
||||||
|
*/
|
||||||
|
public List<Map<String, String>> getMaps(String prefix) {
|
||||||
|
if (source == null) return Collections.emptyList();
|
||||||
|
|
||||||
|
return getPrefixed(prefix).stream()
|
||||||
|
.map(entry -> {
|
||||||
|
String str = entry.getKey();
|
||||||
|
return str.substring(0, str.lastIndexOf("."));
|
||||||
|
})
|
||||||
|
.collect(Collectors.toSet()).stream()
|
||||||
|
.map(this::getMap)
|
||||||
|
.collect(Collectors.toList());
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,361 @@
|
|||||||
|
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" session="false"%>
|
||||||
|
<%@ include file="/WEB-INF/jsp/include/taglib.jsp"%>
|
||||||
|
<c:set var="prefixName" scope="request">사고마약류폐기관리</c:set>
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<meta name="author" content="ZXing for JS">
|
||||||
|
|
||||||
|
<title>QR code reading</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" rel="preload" as="style" onload="this.rel='stylesheet';this.onload=null"
|
||||||
|
href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
|
||||||
|
<link rel="stylesheet" rel="preload" as="style" onload="this.rel='stylesheet';this.onload=null"
|
||||||
|
href="https://unpkg.com/normalize.css@8.0.0/normalize.css">
|
||||||
|
<link rel="stylesheet" rel="preload" as="style" onload="this.rel='stylesheet';this.onload=null"
|
||||||
|
href="https://unpkg.com/milligram@1.3.0/dist/milligram.min.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<main class="wrapper" style="padding-top:2em">
|
||||||
|
|
||||||
|
<section class="container" id="demo-content">
|
||||||
|
<h3 class="title">QR code Scan or image upload</h3>
|
||||||
|
|
||||||
|
|
||||||
|
<div id="divScan">
|
||||||
|
<div>
|
||||||
|
<a class="button" id="startButton">Start</a>
|
||||||
|
<a class="button" id="resetButton">Reset</a>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<video id="video" width="300" height="200" style="border: 1px solid gray"></video>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="sourceSelectPanel" style="display:none">
|
||||||
|
<label for="sourceSelect">Change video source:</label>
|
||||||
|
<select id="sourceSelect" style="max-width:400px">
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="divImage" style="display: none;">
|
||||||
|
<div>
|
||||||
|
<!-- <img id="img" src="../../images/qr_code.png" style="width:300px; height: 200px; border: 1px solid gray"></img>-->
|
||||||
|
<div id="img" style="width:300px; height: 200px; border: 1px solid gray"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<label>Result:</label>
|
||||||
|
<pre><code id="result"></code></pre>
|
||||||
|
<textarea id="result2" style="width: 500px; height: 200px"></textarea>
|
||||||
|
<p><c:out value="${apiHost}"/></p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<section class="container">
|
||||||
|
<p></p>
|
||||||
|
</section>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<!--<script type="text/javascript" src="https://unpkg.com/@zxing/library@latest/umd/index.min.js"></script>-->
|
||||||
|
<script src="<c:url value='/resources/js/zxing-library-0.20.0.min.js' />"></script>
|
||||||
|
<script type="text/javascript">
|
||||||
|
window.addEventListener('load', function () {
|
||||||
|
let selectedDeviceId;
|
||||||
|
let isScan = false;
|
||||||
|
const codeReader = new ZXing.BrowserMultiFormatReader()
|
||||||
|
console.log('ZXing code reader initialized')
|
||||||
|
codeReader.listVideoInputDevices()
|
||||||
|
.then((videoInputDevices) => {
|
||||||
|
if (videoInputDevices.length > 0) {
|
||||||
|
isScan = true
|
||||||
|
document.getElementById("divImage").style.display = 'none'
|
||||||
|
document.getElementById("divScan").style.display = 'block'
|
||||||
|
// temp code -----------------------------
|
||||||
|
//document.getElementById("divScan").style.display = 'none'
|
||||||
|
//isScan = false
|
||||||
|
|
||||||
|
//----------------------------------------
|
||||||
|
// chrome browser 인 경우에만
|
||||||
|
//----------------------------------------
|
||||||
|
const sourceSelect = document.getElementById('sourceSelect')
|
||||||
|
selectedDeviceId = videoInputDevices[0].deviceId
|
||||||
|
|
||||||
|
videoInputDevices.forEach((element) => {
|
||||||
|
const sourceOption = document.createElement('option')
|
||||||
|
sourceOption.text = element.label
|
||||||
|
sourceOption.value = element.deviceId
|
||||||
|
sourceSelect.appendChild(sourceOption)
|
||||||
|
})
|
||||||
|
|
||||||
|
sourceSelect.onchange = () => {
|
||||||
|
selectedDeviceId = sourceSelect.value;
|
||||||
|
};
|
||||||
|
const sourceSelectPanel = document.getElementById('sourceSelectPanel')
|
||||||
|
sourceSelectPanel.style.display = 'block'
|
||||||
|
//--------------------------------------------
|
||||||
|
|
||||||
|
document.getElementById('startButton').addEventListener('click', () => {
|
||||||
|
codeReader.decodeFromVideoDevice(selectedDeviceId, 'video', (result, err) => {
|
||||||
|
if (result) {
|
||||||
|
console.log(result)
|
||||||
|
document.getElementById('result').textContent = result.text
|
||||||
|
}
|
||||||
|
if (err && !(err instanceof ZXing.NotFoundException)) {
|
||||||
|
console.error(err)
|
||||||
|
document.getElementById('result').textContent = err
|
||||||
|
}
|
||||||
|
})
|
||||||
|
console.log(`Started continous decode from camera with id ${selectedDeviceId}`)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!isScan) {
|
||||||
|
document.getElementById("divScan").style.display = 'none'
|
||||||
|
document.getElementById("divImage").style.display = 'block'
|
||||||
|
|
||||||
|
const sec9 = document.querySelector('#divImage');
|
||||||
|
const uploadBox = sec9.querySelector('#img');
|
||||||
|
|
||||||
|
/* 박스 안에 Drag 들어왔을 때 */
|
||||||
|
uploadBox.addEventListener('dragenter', function (e) {
|
||||||
|
console.log('dragenter');
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 박스 안에 Drag를 하고 있을 때 */
|
||||||
|
uploadBox.addEventListener('dragover', function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
console.log('dragover');
|
||||||
|
|
||||||
|
const vaild = e.dataTransfer.types.indexOf('Files') >= 0;
|
||||||
|
|
||||||
|
if (!vaild) {
|
||||||
|
this.style.backgroundColor = 'red';
|
||||||
|
} else {
|
||||||
|
this.style.backgroundColor = 'green';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 박스 밖으로 Drag가 나갈 때 */
|
||||||
|
uploadBox.addEventListener('dragleave', function (e) {
|
||||||
|
console.log('dragleave');
|
||||||
|
|
||||||
|
this.style.backgroundColor = 'white';
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 박스 안에서 Drag를 Drop했을 때 */
|
||||||
|
uploadBox.addEventListener('drop', function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
console.log('drop');
|
||||||
|
this.style.backgroundColor = 'white';
|
||||||
|
|
||||||
|
console.dir(e.dataTransfer);
|
||||||
|
|
||||||
|
//유효성 Check
|
||||||
|
if (!isValid(e.dataTransfer)) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const data = e.dataTransfer.files;
|
||||||
|
console.dir(data);
|
||||||
|
//
|
||||||
|
const formData = new FormData();
|
||||||
|
for (let i = 0; i < data.length; i++) {
|
||||||
|
formData.append('uploadFiles', data[i]);
|
||||||
|
}
|
||||||
|
|
||||||
|
document.getElementById('result').textContent = ''
|
||||||
|
document.getElementById('result2').value = ''
|
||||||
|
requestSubmit({
|
||||||
|
//url: '/api/biz/nims/v1/getProductInfoByQrcodeImg',
|
||||||
|
url: '<c:url value="${apiHost}/api/biz/nims/v1/getProductInfoByQrcodeImg" />',
|
||||||
|
method: 'POST',
|
||||||
|
data: formData,
|
||||||
|
progress: () => {
|
||||||
|
|
||||||
|
},
|
||||||
|
loadend: (res) => {
|
||||||
|
const data = JSON.parse(res)
|
||||||
|
if (data.success) {
|
||||||
|
//console.log(data[0].qrcode)
|
||||||
|
document.getElementById('result2').value = JSON.stringify(data)
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
alert(JSON.stringify(data));
|
||||||
|
|
||||||
|
},
|
||||||
|
error: (e) => {
|
||||||
|
console.error(e)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// document.getElementById('decodeButton').addEventListener('click', () => {
|
||||||
|
// const img = document.getElementById('img')
|
||||||
|
// codeReader.decodeFromImage(img).then((result) => {
|
||||||
|
// console.log(result)
|
||||||
|
// document.getElementById('result').textContent = result.text
|
||||||
|
// }).catch((err) => {
|
||||||
|
// console.error(err)
|
||||||
|
// document.getElementById('result').textContent = err
|
||||||
|
// })
|
||||||
|
// console.log(`Started decode for image from ${img.src}`)
|
||||||
|
// })
|
||||||
|
}
|
||||||
|
|
||||||
|
document.getElementById('resetButton').addEventListener('click', () => {
|
||||||
|
codeReader.reset()
|
||||||
|
document.getElementById('result').textContent = '';
|
||||||
|
console.log('Reset.')
|
||||||
|
})
|
||||||
|
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error(err)
|
||||||
|
})
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
function isValid(data) {
|
||||||
|
|
||||||
|
//파일인지 유효성 검사
|
||||||
|
if (data.types.indexOf('Files') < 0) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
const files = data.files
|
||||||
|
//파일의 개수는 1개씩만 가능하도록 유효성 검사
|
||||||
|
if (files.length > 1) {
|
||||||
|
alert('파일은 하나씩 전송이 가능합니다.');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
//이미지인지 유효성 검사
|
||||||
|
let isStop = false;
|
||||||
|
let fileInfos = [];
|
||||||
|
for (let i = 0; i < files.length; i++) {
|
||||||
|
if (files[i].type.indexOf('image') < 0) {
|
||||||
|
isStop = true;
|
||||||
|
alert('이미지 파일만 업로드 가능합니다.');
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
//파일의 사이즈는 1MB 미만
|
||||||
|
if (files[i].size >= 1024 * 1024 * 2) {
|
||||||
|
isStop = true;
|
||||||
|
alert('2MB 이상인 파일은 업로드할 수 없습니다.');
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
fileInfos[i] = {
|
||||||
|
fileName: files[i].name,
|
||||||
|
size: files[i].size
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (isStop) {
|
||||||
|
fileInfos = null;
|
||||||
|
return isStop;
|
||||||
|
}
|
||||||
|
alert(JSON.stringify(fileInfos));
|
||||||
|
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* <pre>
|
||||||
|
* file upload 요청
|
||||||
|
* obj = {
|
||||||
|
* method: string
|
||||||
|
* url: string
|
||||||
|
* data: FormData
|
||||||
|
* }
|
||||||
|
*
|
||||||
|
* @param obj
|
||||||
|
* </pre>
|
||||||
|
*/
|
||||||
|
function requestSubmit(obj) {
|
||||||
|
const xhr = new XMLHttpRequest();
|
||||||
|
|
||||||
|
/* 성공/에러 */
|
||||||
|
xhr.addEventListener('load', function () {
|
||||||
|
const data = xhr.responseText;
|
||||||
|
|
||||||
|
if (obj.load) {
|
||||||
|
obj.load(data);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 성공 */
|
||||||
|
xhr.addEventListener('loadend', function () {
|
||||||
|
const data = xhr.responseText;
|
||||||
|
console.log(data);
|
||||||
|
|
||||||
|
if (obj.loadend) {
|
||||||
|
obj.loadend(data);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 실패 */
|
||||||
|
xhr.addEventListener('error', function () {
|
||||||
|
console.log('파일 업로드 요청 중 에러 발생 : ' + xhr.status + ' / ' + xhr.statusText);
|
||||||
|
|
||||||
|
if (obj.error) {
|
||||||
|
obj.error(xhr, xhr.status, xhr.statusText);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 중단 */
|
||||||
|
xhr.addEventListener('abort', function () {
|
||||||
|
if (obj.abort) {
|
||||||
|
obj.abort(xhr);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 진행 */
|
||||||
|
xhr.upload.addEventListener('progress', function () {
|
||||||
|
if (obj.progress) {
|
||||||
|
obj.progress(xhr);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 요청 시작 */
|
||||||
|
xhr.addEventListener('loadstart', function () {
|
||||||
|
if (obj.loadstart) {
|
||||||
|
obj.loadstart(xhr);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const method = obj.method || 'GET';
|
||||||
|
const url = obj.url || '';
|
||||||
|
const data = obj.data || null;
|
||||||
|
|
||||||
|
if (obj.async === false) {
|
||||||
|
xhr.open(method, url, obj.async);
|
||||||
|
} else {
|
||||||
|
xhr.open(method, url, true);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (obj.contentType) {
|
||||||
|
xhr.setRequestHeader('Content-Type', obj.contentType);
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
xhr.send(data);
|
||||||
|
console.log(xhr.status)
|
||||||
|
} catch (e) {
|
||||||
|
console.error(e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue