전단 크로스 필드 의 몇 가지 해결 방식 총화(추천)

전단 지 를 크게 만 들 면 반드시 다 국적 문 제 를 만 날 것 이다.비록 인터넷 에 있 는 자료 도 많 지만 저 는 제 가 한 번 쓰 는 것 을 좋아 합 니 다.제 가 이해 하고 정리 한 것 이 가장 기억 에 남 습 니 다.
동원 정책
JavaScript 의 동원 전략 은 Netscape 가 제시 한 유명한 보안 전략 으로 A 역 의 JS 가 다른 사이트 의 데 이 터 를 조작 하 는 것 을 막 기 위해 서 입 니 다.생각해 보 세 요.당신 은 지금 브 라 우 저 를 열 었 습 니 다.한 tab 창 에서 은행 사 이 트 를 열 었 습 니 다.다른 tab 창 에서 악성 사 이 트 를 열 었 습 니 다.그 악성 사 이 트 는 은행 정 보 를 전문 적 으로 수정 하 는 자바 스 크 립 트 를 끊 었 습 니 다.이 악성 사 이 트 를 방문 하고 자바 스 크 립 트 를 실행 할 때,당신 의 은행 페이지 는 이 자 바스 크 립 트 에 의 해 수 정 될 것 입 니 다.(예 를 들 어 당신 의 카드 번호 와 비밀 번 호 를 얻 거나 해커 의 계좌 로 이체 하 는 등)결 과 는 매우 심각 할 것 입 니 다!한편,동원 전략 은 이런 일이 발생 하 는 것 을 방지 하기 위해 A 사이트 의 JS 파일 은 A 사이트 의 데이터 만 조작 할 수 있 고 B 사이트 의 데 이 터 를 조작 할 수 없다 고 규정 했다.
이해 하기 편 하도록 이 단 어 를 동원 과 전략 이라는 두 단어 로 나 눕 시다.
동원 이란 자원 이 같은 원천 에서 온 것 을 가리킨다.두 페이지 가 같은 프로 토 콜,포트 번호,호스트(하위 도 메 인 이름과 주 도 메 인 이름 포함)를 가지 고 있다 면 이 두 페이지 는 같은 원본 에 속 합 니 다.
전략 이란 무엇 을 할 수 있 는 지 를 말한다.같은 소스 의 JS 는 같은 소스 의 데 이 터 를 조작 할 수 있 습 니 다.
예 를 들 어 이해 하 셨 는 지 보 세 요.아래 링크 를 보 세 요.프로 토 콜 은 http 프로 토 콜 입 니 다.호스트 는 store.copany.com 입 니 다.포트 번 호 는 기본적으로 80 입 니 다.그리고 아래 표 의 각 URL 과 비교 하여 어떤 것 이 동원 적 이 고 어떤 것 이 동원 적 이지 않 은 지 판단 해 보 세 요.
URL
결실
원인.
http://store.company.com/dir2/other.html
근원 을 같이 하 다
 
http://store.company.com/dir/inner/another.html
근원 을 같이 하 다
 
https://store.company.com/secure.html
비 동원
협의 가 다르다
http://store.company.com:81/dir/etc.html
비 동원
포트 가 다르다
http://news.company.com/dir/other.html
비 동원
호스트 가 다 름
무엇이 크로스 필드 입 니까?
크로스 필드

크로스 필드 솔 루 션
프로젝트 1-JSONP
JSONP 는 JSON with padding 의 약자 입 니 다.JSONP 는 두 부분 으로 구성 되 어 있 습 니 다.리 셋 함수 와 데이터 입 니 다.
리 셋 함 수 는 클 라 이언 트 와 서버 에서 함수 이름 을 약속 한 것 으로 일반적으로 요청 에서 지정 합 니 다.
데 이 터 는 리 셋 함수 에 들 어 오 는 JSON 데이터 입 니 다.
JSONP 은 동적 으로.callback({"name": "michael"});문제 1:JSONP 는 동적 으로 script 라벨 을 만들어 야 합 니 다.이 script 요 소 를 처리 할 필요 가 있 습 니까?어떻게 할 까요?
문제 2:JSONP 가 요청 할 때 서버 에 오류 가 발생 하면 어떻게 해 야 합 니까?예 를 들 어 서버 가 붕괴 되 었 습 니 다.예 를 들 어 404 페이지 로 돌아 가 고 전단 에서 이 오 류 를 어떻게 처리 해 야 합 니까?직접 던 져 야 합 니까?
답안
JSONP 는 GET 요청 만 수행 할 수 있 고,CORS 는 모든 종류의 HTTP 요청 을 지원 합 니 다.
JSONP 는 호환성 이 좋아 XML HttpRequest 지원 이 필요 없습니다.
방안 2-크로스 도 메 인 자원 공유 CORS
크로스 도 메 인 자원 공 유 는 크로스 도 메 인 자원 에 접근 해 야 할 때 브 라 우 저 와 서버 가 어떻게 소통 해 야 하 는 지 정의 합 니 다.사용자 정의 HTTP 헤드 를 사용 해 서버 와 브 라 우 저 를 소통 시 키 는 원리 로,응답 헤드 를 설정 한 Access-Control-Allow-Origin 을 통 해 목적 을 달성 하 는 것 이 그의 원리 다.
프로젝트 3-document.domain
브 라 우 저의 동원 정책 으로 인해 서로 다른 영역의 프레임 워 크 는 JS 의 상호작용 을 할 수 없습니다.예 를 들 어 한 페이지 는http://www.examples.com/a.htmls이 고 이 페이지 에 또 하나의http://examples.com/b.htmls가 있 습 니 다.a.html 와 b.html 는 서로 다른 도 메 인 이기 때문에 우 리 는 페이지 에 js 코드 를 써 서 iframe 중의 물건 을 얻 을 수 없습니다.그러나 우리 가 이 두 페이지 의 document.domain 을 모두 같은 도 메 인 이름 으로 설정 하면 됩 니 다.주의해 야 할 것 은...우 리 는 document.domain 을 자신 이나 더 높 은 부모 도 메 인 으로 설정 할 수 있 고 주 도 메 인 이름 은 같 아야 합 니 다.
사용 조건
document.domain 은 서로 다른 자 역 의 프레임 워 크 간 의 상호작용 에 적 용 됩 니 다.
프로젝트 4-window.name
window 대상 은 name 속성 이 있 습 니 다.이 속성 은 한 창의 수명 주기 에 창 이 불 러 온 모든 페이지 는 window.name 을 공유 하 는 것 이 특징 입 니 다.모든 페이지 는 window.name 에 대해 읽 기와 쓰기 권한 이 있 습 니 다.window.name 은 한 창 이 불 러 온 모든 페이지 에 영구적 으로 존재 합 니 다.
프로젝트 5-window.postMessage
window.postmessage(message,targetOrigin)방법 은 다른 window 대상 에 게 메 시 지 를 보 낼 수 있 습 니 다.이 window 대상 이 같은 소스 에 속 하 든 다른 소스 에 속 하 든 간 에.
이상 은 이 글 의 전체 내용 입 니 다.본 논문 의 내용 이 여러분 의 학습 이나 업무 에 어느 정도 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 댓 글 을 남 겨 주 십시오.저희 에 대한 지지 에 감 사 드 립 니 다!