1

크롬 확장 프로그램이 처음이므로 시작하는 데 약간의 문제가 있습니다.크롬 전달 기능에서 전달되는 메시지가 작동하지 않음

우선 내 전반적인 목표는 내 팝업에서 버튼을 클릭하고 DOM 변경 사항이있을 수 있도록하는 것입니다. 내가 올바르게 이해한다면, 이것을하는 방법은 내용 스크립트를 적재하여이 내용 스크립트에 메시지를 보내는 것입니다. 이것은 내가 크롬 개발자 페이지보고에서 가지고있는,하지만 난 콘솔 로그에 아무것도 표시되지 않습니다

manifest.json을

{ 
    "manifest_version": 2, 

    "name": "Test", 
    "version": "1.0", 

    "permissions": [ 
     "tabs", "http://*/*" 
    ], 

    "content_scripts": [ 
     { 
      "matches": ["http://*/*"], 
      "js": ["content.js"] 
     } 
    ], 

    "browser_action": { 
     "default_icon": "icon.png", 
     "default_popup": "popup.html" 
    } 
} 

popup.html

<html> 
    <body> 
    <script src="popup.js"></script> 
    </body> 
</html> 

팝업 된 .js

document.addEventListener('DOMContentLoaded', function() { 
    chrome.tabs.getSelected(null, function(tab) { 
     chrome.tabs.sendMessage(tab.id, {greeting: "hello"}, function(response) { 
      console.log(response.farewell); 
     }); 
    }); 
}); 

content.js

chrome.runtime.onMessage.addListener(
    function(request, sender, sendResponse) { 
     console.log(sender.tab ? 
        "from a content script:" + sender.tab.url : 
        "from the extension"); 
     if (request.greeting == "hello") 
      sendResponse({farewell: "goodbye"}); 
    }); 

이 코드는 대부분 문서에서 직접 가져온 것입니다. 그래서 내가 뭘 잘못하고 있는지 잘 모릅니다.

+0

코드에 문제가없는 것으로 나타났습니다. Chrome 버전이 무엇인가요? 그리고 전반적인 목표에 따르면 'chrome.browserAction.onClicked' (팝업 없음)를 듣고 콘텐츠 스크립트 (https://developer.chrome.com/extensions/content_scripts.html#pi)를 프로그램 방식으로 삽입해야한다고 생각합니다. 이벤트 핸들러에서. –

+0

@ 方 觉 내가 콘텐츠 스크립트에 보내는 메시지는 팝업의 일부 사용자 입력에 따라 다르므로 필요합니다. 내 크롬 버전은 버전 26.0.1410.63입니다. – gsingh2011

답변

2

난 그냥 내 컴퓨터에 코드를 복사하고 그대로 실행하고 예상대로 작동합니다. 나는 당신이 에 대해 혼란스러워 할지도 모른다고 생각합니다.console.log 출력이 예상됩니다.

웹 페이지를 열고 해당 페이지의 콘솔을 엽니 다. 브라우저 동작을 클릭하면 팝업이 나타나고 줄 번호 from a content script:chrome-extension://fndmlopghajebfadeabnfnfmhalelokm/popup.html이 표시되는지 확인하십시오.

goodbye 행이 표시되지 않습니다. 탭의 콘텐츠 스크립트가 아닌 popup.js에서 로그 아웃 되었기 때문입니다. 팝업에 대한 관리자를 열고 거기에 goodbye 메시지가 있는지 살펴 보겠습니다. 브라우저 작업 아이콘을 마우스 오른쪽 버튼으로 클릭하고 "팝업 검사"메뉴 항목을 선택하십시오. 귀하의 (빈) 팝업이 나타나고 새로운 검사기 창이 나타납니다. 콘솔 탭을 선택하면 여기에 goodbye 메시지가 표시됩니다.

자세한 내용은 Chrome Extension Debugging tutorial을 참조하십시오.

PS.chrome.tabs.getSelected은 더 이상 사용되지 않습니다. you should use chrome.tabs.query 대신 그리고 나는 方 觉에 동의합니다 - DOM을 변경하기 위해 프로그래밍 방식으로 주입하는 것을 고려해야합니다.

+0

감사합니다. 프로그래밍 방식으로 삽입 한 스크립트에 데이터를 전달할 수 있습니까?이것이 제가하지 않았던 이유입니다. 스크립트에 데이터를 전달하는 것이 불가능하다고 생각했습니다. – gsingh2011

+0

@ gsingh2011 : [PI 문서] (https://developer.chrome.com/extensions/content_scripts.html#pi)에 따라 임의의 문자열을 만들어서 'chrome.tabs.executeScript'로 보낼 수 있습니다. 아니면 단순히 모든 페이지 대신에'chrome.tabs.executeScript (null, {file : "content_script.js"});'를 통해 필요할 때 콘텐트 스크립트를 삽입 할 수 있습니다. 그러면 사용자가 열어 본 모든 페이지에 불필요한 스크립트를 추가하지 않고도 계획했던 아키텍처와 동일한 아키텍처를 사용할 수 있습니다. –

-1

popup.js 스크립트는 popup.html (DOMContentLoaded)을로드 할 때 파일을 실행합니다. 하지만 반드시 ""http : // */* "]를 열 수있는 시간이 없으므로 내용이 삽입 된 스크립트는 아직 어떤 웹 페이지에도 없습니다. . 백그라운드 스크립트로 백그라운드 내용 스크립트를 변경하면 제대로 작동한다고 생각합니다.

+0

콘텐트 스크립트가 페이지로드에 삽입되었다고 생각합니다. popup.html을 열기 훨씬 전에 ... – gsingh2011

관련 문제