0

最初の Chrome 拡張機能 (ポップアップ) を作成しようとしています。サーバーにデータを POST します。簡単だろうと思ったのですが、行き詰まってしまいました。

manifest.json で、「http://mypage[dot]com/」と「http://mypage[dot]com/*」のパーミッションを設定して、「mypage[dot]com/api」にアクセスできるようにしました。データの送信先。したがって、私の popup.html は次のようになります。

     <!doctype html>
     <html lang="en">
       <meta charset="UTF-8">
       <title>myExtension</title>
     </head>
     <body>
       <form name="myform">
         <input type="text" name="myText" id="myText"/>
         <input type="submit" name="senden"/>
       </form>
     </body>
       <script src="jquery-1.8.2.min.js"></script>
       <script src="popup.js"></script>
     </html>

したがって、私の popup.js は次のようになります。

      document.forms["myForm"].addEventListener("submit", sendRequest)
      function sendRequest() {
        var myVar= $('#mytext').val();
        var myrequest= $.ajax({
            type: 'POST',
            url: 'http://mypage.com/api/',
            data: {screen_name: 'myname', api_key: 'myKey', var1: myVar},
            success: function(data, textStatus){
                           alert('request successful');
                     },
            error: function(xhr, textStatus, errorThrown){
                        alert(xhr); alert(textstatus); alert(errorThrown);
                     }
            });
       }

ここで、送信ボタンを押すと、次の 3 つのアラートのみが表示されます。最初のアラートは [object Object]、2 番目のアラートはエラー、3 番目のアラートは空のみです。

この問題を解決しようとしましたが、エラーの場所がわかりません。また、いくつかの background.html と content_script.js について読みましたが、それらと何をしなければならないのかわかりません。また、インターネットで見つけたいくつかの拡張機能には、popup.html と popup.js しか含まれておらず、同じようにうまく機能します。行う必要があります (例: domai.nr 拡張子)。

そのため、ポップアップ拡張機能内でデータを正しく投稿するために何を使用し、何をしなければならないかについて、いくつかの説明について非常に満足しています。

4

3 に答える 3

0

最初に head タグを閉じますが、開かないでください

フォームに次のようなIDを付けてみてください

<form id="myform">

次に、このようにjsコードを簡素化します

$('#myform').submit(function(){

    var myVar= $('#mytext').val();

    $.ajax({
        url: "http://mypage.com/api/", 
        type: "POST",        
        data: {screen_name: 'myname', api_key: 'myKey', var1: myVar},   
        success: function(data, textStatus){
            alert('request successful');
        },
        error: function(xhr, textStatus, errorThrown){
            alert(xhr); alert(textstatus); alert(errorThrown);
        }
    });

});
于 2012-10-03T18:11:51.383 に答える
0

http://mypage.com/api/で関数を確認してください。次のような簡単な応答を記述してテストします。

function nameOfFunciton(){
    echo "test";
}

「リクエストが成功しました」というアラートが表示された場合は、コードに問題があります。

于 2013-04-14T20:37:04.790 に答える
0

問題

Cross-Origin ajax 呼び出しを行いたい場合は、適切な権限をリクエストする必要があります。

デバッグ

alert()よりも変数をデバッグするためのより良い方法console.log()。このメソッドの出力を表示するには、コンソールを開く必要があります。ポップアップのコンソールを開くには: ポップアップを開き、右クリックして [要素の検査] を選択します。開発者ツールが開いたら、[コンソール] タブに移動します。console.log(xhr)からよりもはるかに多くの情報を取得できますalert(xhr)。さらに、すべてのパーミッション警告、無効な構文警告などがコンソールに出力されるため、バグを簡単に見つけることができます。

ポップアップからの AJAX

ポップアップからの POST リクエストの送信には 1 週間のポイントがあります。ポップアップが閉じられると (ユーザーがポップアップの外で何かをクリックすると、ポップアップは非常に簡単に閉じられます)、リクエストはキャンセルされます。そして、これがあなたが言及した背景ページです。バックグラウンド ページは (サプライズ、サプライズ) バックグラウンドで動作し、簡単に閉じることができません。ポップアップはバックグラウンド ページと通信し、ajax 呼び出しを行うように要求する必要があります。これを行うと、ポップアップが既に閉じられている場合でも、バックグラウンド ページは AJAX 呼び出しを実行します。

于 2012-10-04T06:23:15.767 に答える