国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

vue的axios組件如何與PHP后端交換數(shù)據(jù)

CloudwiseAPM / 1251人閱讀

摘要：本文的目的在于探討前后端數(shù)據(jù)交互，并給出不同的解決方案供大家參考。實際使用只需在配置文件配置其他配置其他組件配置以上就是前端處理和后端處理兩種解決方案，可根據(jù)實際情況選擇

一、前言

axios是vue項目中用來使用ajax技術來與后臺交換數(shù)據(jù)的一個組件，在vue的作者推薦下，相當數(shù)量的vue前端開發(fā)人員開始使用它。但是在實際開發(fā)過程中，卻時有出現(xiàn)后端接收不到前端post過來的數(shù)據(jù)的情況。以PHP語言開發(fā)的后臺為例，PHP原生的預定義變量$_POST就無法接收（因為解析失敗）。本文的目的在于探討前后端數(shù)據(jù)交互，并給出不同的解決方案供大家參考。

二、目前$_POST可接收的數(shù)據(jù)形式

Form Data
這種數(shù)據(jù)形式其實就是鍵值對，例如id:1，如果有多組鍵值對并且有嵌套的情況，則如下

role-name:ta
role-desc:xxxxxxxxx
id:2
cloud[cla]:001
cloud[cla_baijia]:001
cloud[cla_gongkai]:001
local[soft5]:001
local[soft6]:001
mgmt[mgmt-clouditems]:01

PHP服務端接收到的數(shù)據(jù)其實是這樣子的

role-name=ta&role-desc=xxxxxxxxx&id=2&cloud%5Bcla%5D=001&cloud%5Bcla_baijia%5D=001&cloud%5Bcla_gongkai%5D=001&local%5Bsoft-5%5D=001&local%5Bsoft-6%5D=001&mgmt%5Bmgmt-clouditems%5D=01

是不是與url的參數(shù)特別像？
這種鍵值對的數(shù)據(jù)被稱為QueryString，瀏覽器的原生 form 表單發(fā)送這種數(shù)據(jù)時會把請求頭設為application/x-www-form-urlencoded。
QueryString就能被PHP的$_POST成功解析

經(jīng)典的前端庫jQuery下的jQuery ajax 的 serialize()方法和param()方法就是為把數(shù)據(jù)轉(zhuǎn)化為QueryString而提供的解決方案，前者轉(zhuǎn)化表單數(shù)據(jù)，后者轉(zhuǎn)化JSON數(shù)據(jù)。
而且jQuery的ajax請求中會判斷傳入的數(shù)據(jù)形式，隱式調(diào)用param()方法來轉(zhuǎn)化json數(shù)據(jù)，所以使用者只需直接提供json數(shù)據(jù)即可成功把數(shù)據(jù)成功提交到后臺，需要顯式（手動）調(diào)用param()方法的機會不多。jq默認的發(fā)送的請求頭也是application/x-www-form-urlencoded，大多數(shù)情況下并不需要使用者手動設置。

回到我們的axios中，axios默認發(fā)送的請求頭為application/json，簡單來說，它默認就是會把json傳到后端，并不轉(zhuǎn)化為QueryString。

三、解決方法 1、前端把數(shù)據(jù)轉(zhuǎn)化為QueryString

引入qs庫，調(diào)用stringify方法
2、PHP后端使用php://input獲取原始數(shù)據(jù)

在前端不做任何改變的情況下，因為預定義變量$_POST無法解析，php后端只能使用php://input獲取原始的數(shù)據(jù)，然后再轉(zhuǎn)化為想要的數(shù)據(jù)形式。
如果PHP后臺使用原生開發(fā)，則可自定義一個函數(shù)處理每次請求的數(shù)據(jù)。
如果PHP后臺使用特定的框架開發(fā)，則要看框架本身是否支持處理php://input，簡單的一個測試方法就是在框架的源代碼全文搜索php://input，如果能搜到，則有支持，否則不支持，需要自己擴展相關的處理代碼。

以PHP框架yii2.0為例，全文搜索vendor目錄，可知在yiisoft->yii2->web->Request.php的494行有相關處理代碼。
實際使用只需在配置文件web.php配置

    "components" => [
        "request" => [
            "parsers" => [
                "application/json" => "yiiwebJsonParser"
            ],
            // 其他配置
        ],
        //其他組件配置
    ]

以上就是前端處理和后端處理兩種解決方案，可根據(jù)實際情況選擇

文章版權歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/30754.html

相關文章

  • vue的axios組件如何與PHP后端交換數(shù)據(jù)

    摘要：本文的目的在于探討前后端數(shù)據(jù)交互，并給出不同的解決方案供大家參考。實際使用只需在配置文件配置其他配置其他組件配置以上就是前端處理和后端處理兩種解決方案，可根據(jù)實際情況選擇 一、前言 axios是vue項目中用來使用ajax技術來與后臺交換數(shù)據(jù)的一個組件，在vue的作者推薦下，相當數(shù)量的vue前端開發(fā)人員開始使用它。但是在實際開發(fā)過程中，卻時有出現(xiàn)后端接收不到前端post過來的數(shù)據(jù)的情況...

    韓冰 評論0 收藏0

  • VUE知識點集錦

    摘要：載入前后在階段，實例的和都初始化了，但還是掛載之前為虛擬的節(jié)點，還未替換。類似于，不同在于提交的是，而不是直接變更狀態(tài)可以包含任意異步操作。 vue基礎 1、 router 路由與 a 標簽的區(qū)別：https://www.jianshu.com/p/34b...2、 VUE雙向綁定的原理： 答：VUE實現(xiàn)雙向數(shù)據(jù)綁定的原理就是利用了 Object.defineProperty() 這個...

    APICloud 評論0 收藏0

  • VUE知識點集錦

    摘要：載入前后在階段，實例的和都初始化了，但還是掛載之前為虛擬的節(jié)點，還未替換。類似于，不同在于提交的是，而不是直接變更狀態(tài)可以包含任意異步操作。 vue基礎 1、 router 路由與 a 標簽的區(qū)別：https://www.jianshu.com/p/34b...2、 VUE雙向綁定的原理： 答：VUE實現(xiàn)雙向數(shù)據(jù)綁定的原理就是利用了 Object.defineProperty() 這個...

    Tecode 評論0 收藏0

  • 后端開發(fā)者的Vue學習之路（五）

    摘要：由服務器提供的響應來自服務器響應的狀態(tài)碼來自服務器響應的狀態(tài)信息服務器響應的頭是為請求提供的配置信息所以請求返回后，我們可以通過來獲取響應情況。攔截器攔截器攔截器用于攔截發(fā)起的請求或用于攔截返回的響應。目錄 上節(jié)內(nèi)容回顧 使用第三方組件庫 如何發(fā)起請求 請求錯誤處理 請求帶參 ...

    jay_tian 評論0 收藏0

  • 急速JavaScript全棧教程

    摘要：使用訪問后端服務使用的美化組件的方法整合全棧服務其中的指的是。所幸是在這個教程內(nèi)，你不需要學習太多就可以把案例跑起來。另外一個組件負責顯示全部項目，并接受刪除事件，刪除指定的項目。它們分別是組件和組件這兩個組件的代碼實現(xiàn)，分別在文件和內(nèi)。 自從一年前發(fā)布了Vuejs小書的電子書，也有些日子沒有碰過它們了，現(xiàn)在因為項目的緣故，需要使用JavaScript全棧開發(fā)。所以，我得把這個全棧環(huán)境...

    xingqiba 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<