Chrome 확장 프로그램의 도메인 간 API

외부에 REST API를 호출해야하는 Chrome 용 확장 프로그램을 개발 중입니다. 내 문제는 HTTP 프로토콜로 API를 호출 할 수없는 반면 https로 할 수 있다는 것입니다. 다음은 내 허락 구성입니다 :Chrome 확장 프로그램의 도메인 간 API

"permissions": [ 
     "tabs", 
     "storage", 
     "cookies", 
     "http://*/*", 
     "https://*/*" 
    ]

그리고 여기에 외부 사이트 호출 할 jQuery 코드입니다 :

var host = "https://www.google.com.vn/"; 
    var xhr = new XMLHttpRequest(); 
    xhr.open("GET", host, true); 
    xhr.onreadystatechange = function() { 
     if (xhr.readyState == 4) { 
      if (xhr.status === 200) { 
       alert(xhr.responseText) 
      } else { 
       alert("Error with status:" + xhr.status); 
      } 
     } 
    } 
    xhr.send();

된 HTTPS 사이트와 제대로 코드가 작동 위

, 예를 들면 : https://www.google.com.vn/, https://www.linkedin.com/ ...하지만를 다음과 같은 http 사이트에서 작동하지 않습니다. http://stackoverflow.com/

저는 Android/iOS 개발자이며 jQuery뿐 아니라 Chrome 확장 프로그램에서도 새로운 기능을 제공합니다. 제 실수를 지적 해주십시오. 미리 감사드립니다. 콘텐츠 스크립트 Ajax 호출을하면

출처

2016-07-16 Nguyen Minh Binh

'Chrome 확장 XMLHttpRequest content_security_policy'검색을 통해 [Chrome 확장 XMLHttpRequest : 콘텐츠 보안 정책 안내] (http://stackoverflow.com/a/28237818) 또는 유사한 질문을 참조하십시오. – wOxxOm

, 그것은 웹 페이지의 Content-Security-Policy 헤더에 의해 제한 될 당신 수 없습니다 (사실 해야하지 당신은 chrome.webRequest를 통해 해당 헤더를 제거 할 수 있기 때문에 api, 그러나 그것은 나쁜 것이고 사이트를 안전하지 않게 만들 것입니다) 통제.

이상적인 제안은 확장 컨텍스트에있는 Background (event) page으로 아약스 호출을 전송하는 논리를 이동하는 것이며, 해당 호스트 사용 권한을 선언 할 때 자유롭게 사용할 수 있습니다. 자세한 내용은 Cross-Origin XMLHttpRequest을 참조하십시오.

출처

2016-07-18 01:31:13

감사합니다. 네가 내 머리를 구했어. :) –

그건 사실이 아니야. 콘텐츠 스크립트는 일반적으로 페이지의 CSP에 종속되지 않으며 삽입 된 스크립트의 즉각적인 실행을 위해 페이지의 CSP를 재정의합니다 (https://developer.chrome.com/extensions/contentSecurityPolicy#interactions). – Xan

@HaibaraAi 실패의 실제 이유에 대한 대답을 추가했습니다. – Xan

HTTPS에서는 작동하지만 HTTP 요청에서는 작동하지 않는다고 말하는 것은 웹 보안 문제입니다.

콘텐츠 스크립트가 https://example.com에서 작동하는 경우 코드의 이 기술적으로 안전한 출처로 간주됩니다. 웹 보안은 출처가 안전하지 않은 발신 연결을 차단하며 이는 귀하의 코드에 영향을 미칩니다.

Haibara의 답변은 CSP 문제라고 가정 할 때 올바르지 않습니다. 그러나 제안 된 해결 방법은 정확합니다. 요청을 배경 페이지에 위임하면 코드의 원점은 chrome-extension://yourextensionidhere/이되어 안전하지 않은 출처에 연결할 수 있습니다.

출처

2016-07-18 11:00:13 Xan

내 문제에 초점을 맞추어 주셔서 감사합니다. 나는 여전히'chrome-extension : // yourextensionidhere /'에 대해 이해하지 못합니다. 예를 들어 주시겠습니까? Btw, 이제 백그라운드 스크립트 (위의 내 코멘트 참조)에서 Http 사이트를 호출 할 수 있습니다. –

개발자 모드의 'chrome : // extensions' UI에서 확장 프로그램의 ID를 볼 수 있습니다. 확장 페이지의 URL에있는 'yourextensionidhere'입니다. 예를 들어 ID가'banlckihmmpgfoadeppjepaccpnlnama' 인 확장 프로그램에'background.scripts'가 정의되어 있다면, 배경 페이지의 URL은'chrome-extension : // banlckihmmpgfoadeppjepaccpnlnama/_generated_background_page.html'이됩니다. – Xan

흠, CSP 및 크롬 확장 기능이 많이 있지만 어떻게 배경 스크립트에서 전화하지 않고 내 문제를 팔았습니까? 문제는 https로 할 수 있기 때문에 http 사이트를 호출 할 수 없다는 것입니다. 어떻게 해결할 수 있습니까? –

Chrome 확장 프로그램의 도메인 간 API

답변

관련 문제