2014-12-01 3 views
1

사용자가 요청한 요청 메서드를 변경하려고하지만이 오류가 발생합니다.오류 : 인수 4의 값이 잘못되었습니다. 'method'속성 : 예기치 않은 속성

chrome.webRequest.onBeforeSendHeaders.addListener(function(data) { 
    console.log(data); 
    return {method: "POST"}; 
}, { 
    urls: ["<all_urls>"] 
}, ["blocking", "requestHeaders"]); 

나는 실종 뭔가 :

Error in event handler for webRequest.onBeforeSendHeaders/1: Error: Invalid value for argument 4. Property 'method': Unexpected property.

내 코드는 무엇입니까? 많이 검색했지만 요청 방법을 변경할 수있는 항목이 없습니다. webRequest

답변

3

확장 API를 통해 HTTP 메소드를 즉시 변경할 수 없습니다. 원하는 결과를 얻는 방법에는 여러 가지가 있습니다. 아래의 답변에서 유형 sub_framemain_frame의 요청에 대해이 작업을 수행하는 방법을 설명합니다. 그 이유는 사용자가 원했던 것일뿐입니다 (image 또는 stylesheet과 같은 유형의 POST는 실제로 이해가되지 않습니다).

content script을 통해 GET 요청 대신 POST 요청을 시작하도록 요청자를 수정할 수 있습니다. 예 : <form>을 찾고 action"POST"으로 설정하십시오.

일반적으로 작동하는 일반적인 방법은 요청을 가로 채고 내선 페이지로 리디렉션하여 원하는 대상으로 양식을 제출하는 것입니다. web_accessible_resources에 페이지를 추가하는 것을 잊지 마십시오. URL (쿼리 문자열 또는 참조 단편)을 사용하여 프레임에 매개 변수를 전달하거나 사전에 매개 변수를 저장하고 배경 페이지에 extension messaging API을 사용하여 통신 할 수 있습니다.
예 (URL을 전달하는 쿼리 문자열을 사용하여) :

chrome.webRequest.onBeforeRequest.addListener(function(details) { 
    var url = chrome.runtime.getURL('redirector.html') + 
      '?' + encodeURIComponent(details.url) 
    return { 
     redirectUrl: url 
    }; 
}, { 
    types: ['main_frame', 'sub_frame'], 
    urls: ['*://example.com/*'] 
}, ['blocking']); 

redirector.html

이 ( web_accessible_resources이 페이지를 추가!) : 매개 변수의 유효성 검사가 남아 :

<form method="POST" id="form"></form> 
<script src="redirector.js"></script> 

redirector.js는 노트 (포함 할 수 독자에게 연습으로) :

var form = document.forms['form']; 

// URL is passed via the parameters 
// "chrome-extension://[extensionid]/redirector.html?http%3A%2F%2Fexample.com%2F 
//            ^
//             becomes http://example.com 
form.action = decodeURIComponent(location.search.slice(1)); 

// Example: Append extra form data 
var input = document.createElement('input'); 
input.type = 'text'; // Default 
input.value = 'extra data'; 
form.appendChild(input); 

form.submit(); 

이것은 매우 간단한 예입니다. 페이지에 더 많은 데이터를 전달하려면 매개 변수의 적절한 직렬화 (예 : JSON 또는 &param=value)를 선택하십시오. 동적으로 생성 된 양식에 대한 자세한 내용은 설명서 (<form>HTMLFormElement)를 참조하십시오.

+0

설명해 주셔서 감사합니다. 정말 도움이되었지만 사용자가 페이지로 이동할 때 요청을 변경하기를 원합니다. 예를 들어, 새 탭에'www.google.com'을 입력하면 GET 요청을하지만, POST 요청이되도록하고 싶습니다. 그게 가능하니? –

+0

@ PabloMatíasGomez 예, 가능합니다. 추가 양식 데이터를 추가하는 예를 사용하여 답변을 업데이트했습니다. –

+0

그게 좋습니다! 이 작업을 수행 할 수 있지만 문제가 있습니다. 양식을 제출하면 onBeforeRequest가 새 요청을 실행하기 때문에 무한 루프가 발생합니다. 요청을 내 양식에서 만들 때 피할 수 있도록 플래그를 추가 할 수 있습니까? ? –

관련 문제