2017-07-20 15 views
0

オープンURLへのリンクであるChrome拡張機能を初めて作成します。 1つはJavaScriptを介してサイトを開き、もう1つはハードコードされたリンクです。どちらもうまくいきません。私がここで間違っていることを確信していない。Chrome拡張機能でURLを開く

manifest.jsonを

{ 
    "manifest_version": 2, 

    "web_accessible_resources": [ 
    "popup.html", "popup.js" 
    ], 

    "name": "Open URL", 
    "description": "Opens a URL.", 
    "version": "1.0.0", 

    "permissions": ["tabs"], 

    "browser_action": { 
     "default_icon": "icon.png", 
     "default_popup": "popup.html", 
     "default_title": "Open a URL" 
    } 
} 

popup.html

<!DOCTYPE html> 
<html> 

<head> 
    <title>Open URL</title> 
    <script src="popup.js"></script> 
</head> 

<body style="width: 100px;"> 
    <p>Open URL</p> 
    <p><a href="javascript:OpenURL('http://www.google.com')">Google</a></p> 
    <p><a href="http://www.stackoverflow.com">Stack Overflow</a></p> 
</body> 

</html> 

popup.js

function OpenURL(location) { 
    chrome.tabs.create({ url: location }); 
} 
+0

インラインjsはクロム拡張ページでは機能しません。参照:[OnClickイベントはクロム拡張では機能しません](// stackoverflow.com/a/29735177) – wOxxOm

+0

注:この質問には実際には2つの問題があります:A)ポップアップのHTMLでのインラインJavaScriptの使用、およびB) 'target =" _ blank "'なしで非拡張URLへのリンクの使用。 A)[Chrome拡張機能のポップアップが機能しない、クリックイベントが処理されない](https://stackoverflow.com/q/17601615)など、多数の重複した質問があります。問題B、私は重複が見つかりませんでした。スタックオーバーフローの質問は、1つの質問につき1つの質問になっています。これがちょうどAならば、これを複製としてクローズすることができました。それがちょうどBだったら、 – Makyen

+0

の質問は重複してターゲットとして使用され、問題について再度尋ねられるべきです。残念ながら、両方の問題を1つの質問で扱うと、誰かが両方の問題について質問していない限り、これを重複したターゲットとして混乱させることになります。別の時間に、1つの質問につき1つだけ質問してください。部分的に無効になる回答がない場合は、質問を '_blank'問題だけに編集することをお勧めしますが、そうすることで回答が無効になることは不適切です。 – Makyen

答えて

0

私に説明してみましょう:

TYPE 1:プレーンアンカーリンク

ソリューション:新しいポップアップでURLを開くために、それにtarget属性(「_空白」)を追加してください。

<a href="http://www.stackoverflow.com" target="_blank">Stack Overflow</a> 

TYPE 2:JavaScriptを使用してアンカーリンク関数ハンドラ

問題:インラインスクリプトの実行を拡張で禁止されている以下をお試しください。したがって、明示的に処理してURLのポップアップを開く必要があります。これらの手順を試してみてください。

ステップ1:IDを持つことのアンカーリンクを処理し、機能をpopupWindow(コール):そのアンカーリンク

<p><a href="http://www.google.com" id="linkId123">Google</a></p> 

ステップ2に#IDを追加します。これらをあなたのコンテンツスクリプトに入れてください。

$(function() { 
    $('#linkId123').click(function() { 
     popupWindow($(this).attr('href'), 'Title',"800px","600px"); 
    }); 
}); 

function popupWindow(url, title, w, h) { 
    var left = (screen.width/2) - (w/2); 
    var top = (screen.height/2) - (h/2); 
    var win = window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=' + w + ', height=' + h + ', top=' + top + ', left=' + left); 
    win.focus(); 
} 

これらの2つのソリューションをテストしたところ、問題なく動作しました。それが役に立てば幸い!

+0

こんにちは。 TYPE 1はうまくいきますが、TYPE 2ではChromeのURLが開かれません。なぜ私のブラウザで動作しないのか分かりません。私も、popupWindow(...)をwindow.open( 'http://www.google.com')で置き換えようとしましたが、どちらもうまくいきませんでした。 – UltraJ

+0

@UltraJ、それを持って、window.openで無効なURLフォーマットを使用しています。 「http」で始まる必要があります。私はそれをもう一度試してみて、そのURLを開いて完全に正常に動作しました( "http://www.google。com ")を新しいウィンドウに表示することもできます。ブラウザコンソールでもこれを確認することができます。 –

関連する問題