게시판 즐겨찾기
편집
드래그 앤 드롭으로
즐겨찾기 아이콘 위치 수정이 가능합니다.
크로스 도메인? 질문합니다.
게시물ID : programmer_18197짧은주소 복사하기
작성자 : 빵미인아
추천 : 0
조회수 : 2013회
댓글수 : 4개
등록시간 : 2016/08/18 16:27:57
옵션
  • 본인삭제금지
1. 서버측 코드

var express = require('express');
var app = express();

var multer = require('multer');
var storage = multer.diskStorage({
  destination: function(req, file, cb){
    cb(null, 'uploads/');
  },
  filename: function(req, file, cb){
    cb(null, file.originalname);
  }
});
var upload = multer({storage : storage});

app.listen(3000, function(){
  console.log("Connected 3000 port!!");
});

app.use(express.static('client'));

app.post('/Graph_UI.html', upload.single('JsonFile'), function(req, res){

});

app.get('/', function(req, res){

});




2. 클라이언트 메인페이지 코드

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8">
<title>Graph UI</title>
<style type="text/css">
body
{
margin: 0px;
}

#box
{
position: relative;
height: auto;
margin: auto;
}

#left
{
position: relative;
width: 20%;
float: left;
}

#right
{
position: relative;
width: 80%;
float: left;
}
</style>
</head>
<body>
<script  src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="Updater.js"></script> <!-- 파일 불러오기 -->
<script src="ReadJson.js"></script> <!-- JSON 데이터 불러오기 -->
<div id="box">
<div id="left">
<p>
<input type="hidden" id="FileName"></input>
<form action="Graph_UI.html" method="post" enctype="multipart/form-data">
<input type="file" value="파일 선택" name="JsonFile" id="File_Reader"></input>
<input type="submit" onclick="ReadJson();"></input>
</form>
</p>
<p>
<form name="form1">
<select size=50 id="Sentences" style="width:90%; height:70%" onclick="Updater(this.value);">
</select>
</form>
</p>
</div>
<div id="right">
<br>그래프 자리</br>
</div>
</div>
</body>
</html>



3. JSON파일 불러오는 코드

function ReadJson()
{
var URL, headidx, endidx, senText, filename;

URL = document.getElementById("File_Reader").value;
headidx = URL.lastIndexOf('\\');
endidx = URL.length;
filename = URL.substring(headidx+1, endidx);
document.getElementById("FileName").value = filename;

$.ajax({
crossOrigin: true,
type: "GET",
url: "127.0.0.1:3000/uploads/"+filename,
datatype: "JSON",
success : function(data){
$(data.sentence).each(function(index, value){
console.log(value.text);
var datas = value.text;
var selector = document.getElementById("Sentences");
var op = document.createElement("option");
op.text = datas;
op.value = filename + "." + value.id;
selector.options.add(op);
console.log(op);
});
}
});
};


위 코드를 실행해서 파일을 불러와 서버에 업로드 후 그 파일을 다시 불러오면

XMLHttpRequest cannot load %3127.0.0.1:3000/uploads/aa.json. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

이런 오류가 나는데 찾아보니 크로스도메인문제라더군요...
해결법이란거 다 해봐도 안되던데 어떻게 해야할까요
전체 추천리스트 보기
새로운 댓글이 없습니다.
새로운 댓글 확인하기
글쓰기
◀뒤로가기
PC버전
맨위로▲
공지 운영 자료창고 청소년보호