web-dev-qa-db-ja.com

タイプの使用方法：jsonp ajax呼び出しでの「POST」

JQuery ajax jsonpを使用しています。私は以下を持っていますJQuery Code：

 $.ajax({  
        type:"GET",        
        url: "Login.aspx",  // Send the login info to this page
        data: str, 
        dataType: "jsonp", 
        timeout: 200000,
        jsonp:"skywardDetails",
        success: function(result)
        { 
             // Show 'Submit' Button
            $('#loginButton').show();

            // Hide Gif Spinning Rotator
            $('#ajaxloading').hide();  
         } 

    });

上記のコードは正常に機能しています。リクエストを"GET"の代わりに"POST"として送信したいのですが、これを実現する方法を提案してください。

ありがとう

jqueryjsonphttp-post
52
Manoj Singh

JSONPを使用してPOSTすることはできません...それは単にその方法では動作しません。データをフェッチする<script>要素を作成します... whichhasはGETリクエストになります。他のドメインに投稿するプロキシとして自分のドメインに投稿する以外にできることはあまりありませんが、ユーザーはできません。これを直接行い、応答を確認してください。

81
Nick Craver

jsonでdataTypeを使用し、次のように送信します。

    $.ajax({
        url: "your url which return json",
        type: "POST",
        crossDomain: true,
        data: data,
        dataType: "json",
        success:function(result){
            alert(JSON.stringify(result));
        },
        error:function(xhr,status,error){
            alert(status);
        }
    });

サーバー側のファイルに次の行を追加します。

pHPの場合：

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST');
header('Access-Control-Max-Age: 1000');

javaの場合：

response.addHeader( "Access-Control-Allow-Origin", "*" ); 
response.addHeader( "Access-Control-Allow-Methods", "POST" ); 
response.addHeader( "Access-Control-Max-Age", "1000" );
36
Pratik Butani AndroidDev

最新のブラウザでは、クロスドメインAJAXクエリ、 Cross-Origin Resource Sharing （より短い、より実用的な このドキュメント はじめに）、最新バージョンのjQueryはすぐにサポートされますが、比較的最新のブラウザーバージョンが必要です（FF3.5 +、IE8 +、Safari 4 +、Chrome4 +; no Opera support AFAIK ）。

7
Tgr

JsonPは、GET、

詳細（PHP） http://www.fbloggs.com/2010/07/09/how-to-access-cross-domain-data-with-ajax-using-jsonp-jquery-and-php /

.NET： http://www.west-wind.com/weblog/posts/2007/Jul/04/JSONP-for-crosssite-Callbacks

2
jesramgue

単にPOST=を使用して自分のサイトに$.ajax()を使用したい場合（たとえば、AJAXエクスペリエンス）をエミュレートする場合）、 jQuery Form Plugin を使用できます。ただし、POSTを別のドメインまたは独自のドメインで異なるプロトコルを使用して行う必要がある場合（安全な_http:_ページへの安全でない_https:_ページ投稿）、jQueryだけでは解決できないクロスドメインスクリプティングの制限に直面します（ 詳細 ）。このような場合、大きな銃を持ち出す必要があります： [〜＃〜] yql [〜＃〜] 。簡単に言えば、YQLはWebスクレイピングです1つの大きなテーブルとしてインターネット全体を照会できるSQLのような構文を持つ言語。今のところ、私の謙虚な意見では、YQLはクロスドメインフォームのPOSTを使用して行う場合の唯一の[簡単な]方法ですクライアント側のJavaScript。

具体的には、YQLの Open Data Table を含む Execute ブロックを使用して、これを実現する必要があります。これを行う方法の概要については、記事「 POST YQLを使用したデータ が必要なHTMLドキュメントのスクレイピング」を参照してください。 Heilmannはすでに POST data を処理するオープンデータテーブルを作成しています。 YQLコンソール 。YQL構文の内訳は次のとおりです。

  • _select *_-SQLと同様にすべての列を選択しますが、この場合、列はクエリによって返されるXML要素またはJSONオブジェクトです。 Webページをスクレイピングするコンテキストでは、これらの「列」は通常HTML要素に対応するため、ページタイトルのみを取得する場合は、_select head.title_を使用します。
  • _from htmlpost_-クエリするテーブル。この場合、「htmlpost」オープンデータテーブルを使用します（これがニーズに合わない場合は、独自のカスタムテーブルを使用できます）。
  • _url="..."_-フォームのaction URI。
  • _postdata="..."_-シリアル化されたフォームデータ。
  • _xpath="..."_-応答に含めるノードの XPath 。これはフィルタリングメカニズムとして機能するため、_<p>_タグのみを含める場合は、_xpath="//p"_;を使用します。 _xpath="//*"_を使用するすべてを含めるには。

「テスト」をクリックして、YQLクエリを実行します。結果に満足したら、（1）「JSON」をクリックして応答形式をJSONに設定し、（2）「診断」のチェックを外して、無関係な診断情報を削除してJSONペイロードのサイズを最小化します。最も重要なビットは、ページの下部にあるURLです。これは、$.ajax()ステートメントで使用するURLです。

ここでは、このサンプルフォームを使用してYQLクエリを介して、クロスドメインフォームPOSTを実行するための正確な手順を示します。

_<form id="form-post" action="https://www.example.com/add/member" method="post">
  <input type="text" name="firstname">
  <input type="text" name="lastname">
  <button type="button" onclick="doSubmit()">Add Member</button>
</form>
_

JavaScriptは次のようになります。

_function doSubmit() {
  $.ajax({
    url: '//query.yahooapis.com/v1/public/yql?q=select%20*%20from%20htmlpost%20where%0Aurl%3D%22' +
         encodeURIComponent($('#form-post').attr('action')) + '%22%20%0Aand%20postdata%3D%22' +
         encodeURIComponent($('#form-post').serialize()) +
         '%22%20and%20xpath%3D%22%2F%2F*%22&format=json&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=',
    dataType: 'json', /* Optional - jQuery autodetects this by default */
    success: function(response) {
      console.log(response);
    }
  });
}
_

url文字列は、YQLコンソールからコピーされたクエリURLです。ただし、フォームのエンコードされたaction URIおよびシリアル化された入力データは動的に挿入されます。

注：インターネットを介して機密情報を渡すときは、セキュリティへの影響に注意してください。機密情報を送信するページが安全であること（_https:_）および SSL 3.0の代わりにTLS 1.xを使用 であることを確認します。

0
thdoan