快捷導(dǎo)航

Jsonp post 跨域方案

更新時(shí)間：2015年07月06日 10:59:52 投稿：hebedich

本文給大家講述的是個(gè)人在一個(gè)項(xiàng)目中遇到的關(guān)于jsonp的post跨域問(wèn)題的解決過(guò)程，這里記錄下來(lái)，分項(xiàng)給大家。

近期在項(xiàng)目中遇到這樣一問(wèn)題，關(guān)于jsonp跨域問(wèn)題，get傳值是可以的，但post傳值死活不行啊，于是網(wǎng)上看了一大堆關(guān)于這方面的資料，最終問(wèn)題得以解決，今天抽空與大家分享下。

說(shuō)明：
http://www.t1.com/index.php 服務(wù)端URL
當(dāng)然這是我本地配置的，需要改為自己對(duì)應(yīng)的地址。

客戶端代碼：

<script>
  $(function(){
     
    var url = 'http://www.t1.com/index.php';
    $.ajax({
      type:      'post',
      url:      url,
      data:      {name:'wangyulu'},
      dataType:    'jsonp',
      success:function(result){
        console.log(result);
      }
    });
     
  });
 </script>

服務(wù)端代碼：

 
<?php
if($_POST){
  $arr = array('name'=>$_POST['name'], 'age'=>23);
  echo json_encode($arr);
}

瀏覽器運(yùn)行如下圖：

看下運(yùn)行結(jié)果，即使設(shè)置傳送方式為 post，Jquery也會(huì)自動(dòng)轉(zhuǎn)為 get，難道Jsonp真的不支持 post 方式提交嗎，繼續(xù)折騰...

折騰到現(xiàn)在最終在 stackoverflow 里找到一些關(guān)于這方面的資料，看來(lái)老外也遇到這樣問(wèn)題呀，地址貼給大家
http://stackoverflow.com/questions/3860111/how-to-make-a-jsonp-post-request-that-specifies-contenttype-with-jquery

關(guān)鍵點(diǎn)如下圖：

看上圖我們發(fā)現(xiàn)，箭頭標(biāo)記處有變化，先不管這么多了，折騰這么久了，先對(duì)應(yīng)放到程序里再說(shuō)嘛，萬(wàn)一可以呢

客戶端更改：
添加：crossDomain: true
修改：dataType: "json"

服務(wù)端添加：
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST');
header('Access-Control-Max-Age: 1000');

運(yùn)行結(jié)果如下圖：

到這里我們發(fā)現(xiàn)問(wèn)題終于解決了，但我們?cè)敿?xì)觀察發(fā)現(xiàn)，請(qǐng)求時(shí)間那是個(gè)漫長(zhǎng)啊，，，看來(lái)老外也沒(méi)個(gè)效率高的解決方案，

最后，我想說(shuō)的是，要想完美支持POST方式的JSONP真心不好辦啊，咱就到這吧，折騰不少時(shí)間了。

以上內(nèi)容可能會(huì)關(guān)聯(lián)到其它技術(shù)點(diǎn)，有興趣自己可去研究哈，這里主要解決 Jsonp ，寫的不好，大家請(qǐng)勿吐槽，謝謝！

以上所述就是本文的全部?jī)?nèi)容了，希望大家能夠喜歡。

您可能感興趣的文章:

最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

Jsonp post 跨域方案

相關(guān)文章

最新評(píng)論

大家感興趣的內(nèi)容

最近更新的內(nèi)容

常用在線小工具