cross-origin 문제 해결하기위해 임시 방편으로 서버 만드는 거 대신 플러그인 다운받아서 한다!

<!DOCTYPE html>
<meta charset="UTF-8">
<script>
// 서버가 없으면 플러그인이 꼭 있어야 함! (ajax cross 오리진 문제)
var xhr = new XMLHttpRequest();
xhr.open("get", "<https://www.ddit.or.kr/review?page=1>", false); // 일단 동기식으로
xhr.onreadystatechange = function(){
    if(xhr.readyState == 4 && xhr.status == 200){
        console.log(xhr.responseText);
    }
}
xhr.send();
</script>

Untitled

해당 페이지의 소스 코드를 가져온 것을 볼 수 있다.

Untitled

위에 소스중에 원하는 값 가져와보기

<!DOCTYPE html>
<meta charset="UTF-8">
<script>
// 서버가 없으면 플러그인이 꼭 있어야 함! (ajax cross 오리진 문제)
var xhr = new XMLHttpRequest();
xhr.open("get", "<https://www.ddit.or.kr/review?page=1>", false); // 일단 동기식으로
xhr.onreadystatechange = function(){
    if(xhr.readyState == 4 && xhr.status == 200){
        let schRegExp = new RegExp('<p class="review_con">.*</p>','g'); //정규표현식 이용 해서 해당 작성한 태그를 찾는 것
        let schRslt = xhr.responseText.match(schRegExp); // 가져온 소스에서 해당 정규표현식에 일치하는 값을 찾는다
        console.log(schRslt);
    }
}
xhr.send();
</script>

Untitled

내용 감싸고 있는 태그 없애고 내용만 가져오기

<!DOCTYPE html>
<meta charset="UTF-8">
<script>
// 서버가 없으면 플러그인이 꼭 있어야 함! (ajax cross 오리진 문제)
var contents = []; // 내용 담을 빈 배열!
var xhr = new XMLHttpRequest();
xhr.open("get", "<https://www.ddit.or.kr/review?page=1>", false); // 일단 동기식으로
xhr.onreadystatechange = function(){
    if(xhr.readyState == 4 && xhr.status == 200){
        let schRegExp = new RegExp('<p class="review_con">.*</p>','g'); //정규표현식 이용 해서 해당 작성한 태그를 찾는 것
        let schRslt = xhr.responseText.match(schRegExp); // 가져온 소스에서 해당 정규표현식에 일치하는 값을 찾는다
        console.log(schRslt);
        for(let i=0; i<schRslt.length; i++){
            // 우린내용만 필요하기에 해당 태그를 replace로 없앰
            contents.push(schRslt[i].replace('<p class="review_con">',"").replace("</p>","")); 
        }
        console.log("체크 : ", contents);
    }
}
xhr.send();
</script>

위에는 태그있는 버전 밑에는 태그 제거하고 내용만 가져온 것을 볼 수 있다.

Untitled