728x90
인턴기간이 얼마 안남아서
프로젝트 UI를 정리하는 과정에서
욕심을 부려서 수정하다가 JS파일이 충돌이 나버렸다.
ERR_INCOMPLETE_CHUNKED_ENCODING 라는 오류...
스크린 샷은 찍지 못했지만 이 오류가 발생하면 우선 페이지가 로드되지 않는다.
말 그대로 화면이 그대로 멈춘다.
이 오류가 발생했을 때 가장 좋은 방법은
처음 초기로 돌아가는것!
우선 오류를 직역하면 불완전한 청크 인코딩 에러인데
정보 조각들을 인코딩하는 과정에서 오류가 발생한 것
즉 내가 작성한 코드가 완전하지 못하다는 말!
<div class="table-responsive">
<table class="table table-striped table-sm" id="AjexList"></table>
<div id="jqGridPager"></div>
</div>
<script>
var test = new Array();
test = ${test};
</script>
<script type="text/javascript">
$(document).ready(function () {
$("#AjexList").jqGrid({
url : "Wealth/wealthList.do",
data : test,
mtype: "GET",
datatype: "local",
colNames:[
'일련번호','구매관리부서','재물위치','물품관리구분','물품취득재원','물품명',
'구입일','취득금액','내용연수','제조사','물품모델명','물품시리얼번호','크기(가로)',
'크기(세로)','크기(높이)','물품등록자_부서','물품등록자','현관리자_직급','현관리자_성명',
'재물상태','등록일','이미지 확인'],
colModel:[
{label:'일련번호',name:'WealthDno', align:'left'},
{label:'구매관리부서',name:'PurchaseMangeDepartMent', align:'left'},
{label:'재물위치',name:'WealthLocation', align:'left'},
{label:'물품관리구분',name:'ItemManageType', align:'left'},
{label:'물품취득재원',name:'ItemAcquisition', align:'left'},
{label:'물품명',name:'ItemName', align:'left'},
{label:'구입일',name:'PurcahseDate', align:'left'},
{label:'취득금액',name:'AcquisitionAmount', align:'left'},
{label:'내용연수',name:'ContentYear', align:'left'},
{label:'제조사',name:'ManuFacture', align:'left'},
{label:'물품모델명',name:'ItemModel', align:'left'},
{label:'물품시리얼번호',name:'ItemSerialNumber', align:'left'},
{label:'크기(가로)',name:'HorizontalSize', align:'left'},
{label:'크기(세로)',name:'VerticalSize', align:'left'},
{label:'크기(높이)',name:'HeightSize', align:'left'},
{label:'물품등록자_부서',name:'ItemRegisterDepartment', align:'left'},
{label:'물품등록자',name:'ItemRegisterName', align:'left'},
{label:'현관리자_직급',name:'CurrentManagerRank', align:'left'},
{label:'현관리자_성명',name:'CurrentManagerName', align:'left'},
{label:'재물상태',name:'WealthState', align:'left'},
{label:'등록일',name:'ItemRegisterDate', align:'left'},
{label:'이미지 확인', index: 'Img', width: 100, align: 'center', formatter: imageFormatter}
],
width: "90%",
height: "90%",
rowNum: 30,
scrollLeftOffset: "83%",
viewrecords: true,
loadonce: true,
scroll: 1, // set the scroll property to 1 to enable paging with scrollbar - virtual loading of records
pager: "#jqGridPager"
});
});
for(var I in test){
$("#AjexList").jqGrid('addRowData',i+1,test[i]);
}
function imageFormatter(cellvalue, options, rowObject)
{
console.log(rowObject);
if(rowObject.imgUrl == null){
return;
}
checkResult = "<img src='${pageContext.request.contextPath}/img/" + rowObject.imgUrl + "/>";
return checkResult;
}
</script>
위의 코드처럼 Jquery Grid를 한개만 호출해서 잘 작동한다.
우선은 해결은 했으니 문제점을 분석해보면
grid를 만들다가 나도 모르게 코드가 꼬인 것!
즉 JS나 CSS파일 그리고 Tag가 일치하지 않아서 생긴 문제라고 판별했다.
이유는 Tag를 정렬하고 JS와 CSS파일들을 정리한 순간
오류는 해결됬다.
따라서 ERR_INCOMPLETE_CHUNKED_ENCODING 오류가 발생한다면
CSS / JS / jsp Tag를 잘 확인해서 필요없거나 잘못된 건 제거하는게 중요하다고 느꼈다.
다음에도 더 좋은 포스팅으로 찾아오겠습니다.
728x90