ajax를 호출하여 원격 URL에 게시 된 양식 데이터

Question

2 단계 게시물을 수행하고 싶습니다. 첫 번째는 "email = blah & dude = car"등과 같은 양식 데이터를 만드는 내 서비스에 대한 AJAX 게시물입니다.

AJAX 호출에 대한 콜백에서 해당 데이터를 원격 사이트에 다시 게시해야합니다. 정상적인 게시물.

var formData = "some form data"; 
$.ajax({ 
    type: 'POST', 
    url: '/myservice', 
    data: formData, 
    success: function(data, status) { 
      xmlhttp=new XMLHttpRequest(); 
         xmlhttp.open("POST","http://remotepage.com",true); 
         xmlhttp.send(data); 
    }, 
    error: function(XMLHttpRequest, textStatus, errorThrown) { 
     //display error message  }, 
    dataType: "text", 
}); 

그러나, HttpRequest에 의한 remotepage.com에 XSS 방지에 실패합니다

내가 좋아하는 뭔가를 생각했다. 처리 된 양식 데이터를 원격 URL에 쉽게 다시 게시하려면 어떻게합니까?

Answer 1

http://remotepage.com에 호스트 된 사이트가 아닌 한 에 http://remotepage.com (xmlhttp.open("POST","http://remotepage.com",true);)으로 AJAX 요청을 보내면 작동하지 않습니다.

이렇게하려면 도메인과 원격 도메인 사이의 다리 역할을하는 서버 측 스크립트를 설정해야하며 그러면 스크립트에 AJAX 요청을 보냅니다. 원격 도메인은 당신이 직접 요청을 보낼 수 JSONP 지원하는 경우

var formData = "some form data"; 
$.ajax({ 
    type: 'POST', 
    url: '/myservice', 
    data: formData, 
    success: function(data, status) { 
     $.post('/some_bridge_script', formData); 
    }, 
    error: function(XMLHttpRequest, textStatus, errorThrown) { 
     //display error message  }, 
    dataType: "text", 
}); 

을하지만, 단지 GET 요청으로 제한됩니다 : 당신이 jQuery를 사용하고 있기 때문에뿐만 아니라 성공 콜백을 사용하는 것이 더 자연스러운 것 같다 .

Answer 2

수정/생성하려는 리소스의 양식을 묻는 remotepage.com에 배경 GET 요청을 보내야합니다. 이렇게하면 리모트 페이지가 쿠키 저장소에 진위 토큰을 설정할 수 있습니다. 이 양식을 숨기고 myservice에 성공적으로 게시 된 데이터로 채우고 숨겨진 양식을 게시하십시오. 이렇게하면 remotepage.com은 귀하가 신뢰할 수 있는지 확인할 수있는 기회를 갖게됩니다.

편집 : 추가 코드 샘플

여기에 내가 상상하고있는 무슨에 샘플 코드의 비트입니다 :

var formData = "some form data"; 
$.post({ 
    url: '/myservice', 
    data: formData, 
    success: postToRemote, 
    dataType: "JSON", 
    error: function(XMLHttpRequest, textStatus, errorThrown) { 
    // display error message 
    }, 
});

그래서 대신 텍스트를 반환 MYSERVICE는 처리 된 데이터를 포함하는 JSON 개체를 반환해야 아래에 귀하의 의견에 대해 이야기. 콜백은 remotepage에서 원하는 양식을 요청합니다. 로드가 완료되면 익명 함수()의 블록이 실행되어 양식을 채운 다음 제출합니다.

#empty_container_for_form { display: none; }