Chrome 확장 프로그램 : 새 탭에서 링크를 여는 방법은 무엇입니까?


79

내 Stackoverflow 폴더에는 stackoverflow.ico2 개의 벨로우 파일이 있습니다. Chrome으로 가져 오면 주소 표시 줄에 아이콘이 표시되지만 클릭하면 Chrome에서 새 탭이 열리지 않습니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까?

manifest.json

{
  "name": "Stackoverflow",
  "version": "1",
  "browser_action":
  {
    "default_icon": "stackoverflow.ico"
  },
  "background":
  {
    "page": "index.html"
  },
  "permissions": ["tabs"],
  "manifest_version": 2
}

index.html

<html>
  <head>
    <script>
      chrome.browserAction.onClicked.addListener(function(activeTab)
      {
        var newURL = "http://stackoverflow.com/";
        chrome.tabs.create({ url: newURL });
      });
    </script>
  </head>
</html>

답변:


119

문제는 매니페스트 버전 2를content security policy 위반하고 있다는 것 입니다. 이 문제를 해결하려면 인라인 스크립트를 제거하기 만하면됩니다 page. 이 경우 배경 . 다음 script과 같은 배경으로 바꿉니다.

manifest.json

"background":{
  "scripts": ["background.js"]
},

background.js

chrome.browserAction.onClicked.addListener(function(activeTab){
  var newURL = "http://stackoverflow.com/";
  chrome.tabs.create({ url: newURL });
});

어떤 이유로 페이지 여야한다면 스크립트를 외부 파일로 포함하고 이전과 같이 페이지로 선언하면됩니다.


popup.js에서 newURL을 어떻게 보낼 수 있습니까?
Nikhil Kulkarni

20

제 경우에는 확장 팝업 창에서 링크를 클릭 할 때 새 탭에서 링크를 열어야했는데 target속성이 다음과 _blank같이 설정되어 제대로 작동했습니다 .

<a href="http://www.example.com" target="_blank">Example</a>

5
글쎄, 이것은 브라우저에서 새 탭을 열지 만 팝업을 닫을 것입니다 (항상 원하는 것은 아닙니다).
fvrab

5

더 간단한 솔루션 을 선호 합니다-onclick에 작업을 추가하기 만하면됩니다.

$('body').on('click', 'a[target="_blank"]', function(e){
    e.preventDefault();
    chrome.tabs.create({url: $(this).prop('href'), active: false});
    return false;
});

그러면 팝업 포커스를 잃지 않고 새 탭에서 target = "_ blank"속성 을 가진 모든 링크 (동적으로 생성 된 링크 포함)가 열립니다 .


이걸 어디로 불러요? content.js 또는 background.js 아래에 작성되어 있습니까?
gumuruh

그것은 content.js로 작성
fvrab
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.