angularjs中$http模塊發(fā)送post請(qǐng)求request payload轉(zhuǎn)form data

Jiavan 發(fā)布于2019-08-20 19:08 / 1641人閱讀

摘要：背景在開發(fā)一個(gè)證書照片刪除的時(shí)候，后端提供了一個(gè)接口，需要前端將數(shù)據(jù)轉(zhuǎn)化成。而在中，如果直接用方式，發(fā)送數(shù)據(jù)是以而不是以。運(yùn)行結(jié)果這樣后端是無法獲取的。使用對(duì)數(shù)據(jù)進(jìn)行處理結(jié)尾最后沒有用以上的任何一種方法解決。

背景： ionic+ angularjs+ cordova
在開發(fā)一個(gè)證書照片刪除的時(shí)候，后端提供了一個(gè)post接口，需要前端將數(shù)據(jù)轉(zhuǎn)化成form data。而在angularjs中，如果直接用post方式，發(fā)送數(shù)據(jù)是以Request Payload而不是以Form Data。

$http({
    method: "POST",
    url: url,
    data: data
}).success(function () {});

運(yùn)行結(jié)果： chrome

這樣后端是無法獲取的。

解決辦法：
1、對(duì)post進(jìn)行配置

$http({
    method: "POST",
    url: url,
    headers: {"Content-Type": "application/x-www-form-urlencoded"},
    transformRequest: function(obj) {
        var str = [];
        for(var p in obj)
        str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
        return str.join("&");
    },
    data: xsrf
}).success(function () {});

這樣就能轉(zhuǎn)化成form data數(shù)據(jù)讓后端接收了。

2、使用jquery對(duì)數(shù)據(jù)進(jìn)行處理
var data = $.param(data)

結(jié)尾：
最后沒有用以上的任何一種方法解決。因?yàn)檎麄€(gè)項(xiàng)目是用websocket方式（除了實(shí)名認(rèn)證和添加證書時(shí)考慮斷點(diǎn)續(xù)傳用了http方式），經(jīng)過一番套路，總監(jiān)讓后端改成用websocket的方式了，然后就沒有然后了。。。

云服務(wù)器 GPU云服務(wù)器 HTTP_RAW_POST_DATA 發(fā)送post請(qǐng)求模擬post發(fā)送請(qǐng)求 ajax發(fā)送post請(qǐng)求

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/85198.html

相關(guān)文章

Jquery 以及AngularJS 中 Get/Post 傳參筆記

摘要：傳參并不是很難的事，但有時(shí)牽扯到例如要傳一個(gè)對(duì)象或者到后端的時(shí)候就會(huì)有些麻煩，在這里總結(jié)一些使用方法。在中可以通過設(shè)定來解決在中就比較難設(shè)定，參見錯(cuò)誤之處或者更多方案歡迎提出，謝謝傳參并不是很難的事，但有時(shí)牽扯到例如要傳一個(gè)對(duì)象或者form到后端的時(shí)候就會(huì)有些麻煩，在這里總結(jié)一些使用方法。首先先介紹發(fā)送請(qǐng)求時(shí)我們經(jīng)常會(huì)混淆的幾個(gè)屬性：dataType: 期待服務(wù)器返回的數(shù)據(jù)格式mi...

HackerShell 2019-08-22 17:14 評(píng)論0 收藏0
JS基礎(chǔ)篇--JS之表單提交時(shí)編碼類型enctype詳解

摘要：格式支持比鍵值對(duì)復(fù)雜得多的結(jié)構(gòu)化數(shù)據(jù)，這一點(diǎn)也很有用。例如下面這段代碼最終發(fā)送的請(qǐng)求是這種方案，可以方便的提交復(fù)雜的結(jié)構(gòu)化數(shù)據(jù)，特別適合的接口。簡(jiǎn)介 form的enctype屬性為編碼方式，常用有兩種：application/x-www-form-urlencoded和multipart/form-data，默認(rèn)為application/x-www-form-urlencoded。 ...

ad6623 2019-08-21 17:26 評(píng)論0 收藏0
使用 Flask 和 AngularJS 構(gòu)建博客 - 1

摘要：注原文作者，原文地址為在這個(gè)教程中，我們將使用和構(gòu)建一個(gè)博客。在開發(fā)期間，這將允許我們把它們運(yùn)行在不同的端口例如和。現(xiàn)在我們將進(jìn)入目錄并使用運(yùn)行這個(gè)腳本。示例創(chuàng)建一篇文章為了創(chuàng)建一篇文章，你需要發(fā)送一個(gè)請(qǐng)求給。注：原文作者 John Kevin M. Basco，原文地址為 Building a blog using Flask and AngularJS Part 1 在...

劉玉平 2019-08-21 12:27 評(píng)論0 收藏0
使用 Flask 和 AngularJS 構(gòu)建博客 - 1

摘要：注原文作者，原文地址為在這個(gè)教程中，我們將使用和構(gòu)建一個(gè)博客。在開發(fā)期間，這將允許我們把它們運(yùn)行在不同的端口例如和?，F(xiàn)在我們將進(jìn)入目錄并使用運(yùn)行這個(gè)腳本。示例創(chuàng)建一篇文章為了創(chuàng)建一篇文章，你需要發(fā)送一個(gè)請(qǐng)求給。注：原文作者 John Kevin M. Basco，原文地址為 Building a blog using Flask and AngularJS Part 1 在...

lavnFan 2019-07-24 17:39 評(píng)論0 收藏0
[譯] 使用angularjs創(chuàng)建一個(gè)CRUD應(yīng)用

摘要：我使用的是為這個(gè)示例應(yīng)用設(shè)計(jì)接口。發(fā)起一個(gè)請(qǐng)求體為的請(qǐng)求。目前只有一個(gè)可以設(shè)置。創(chuàng)建一個(gè)的應(yīng)用為了加強(qiáng)的概念我們?yōu)殡娪皭酆谜邉?chuàng)建一個(gè)應(yīng)用。我已經(jīng)使用和創(chuàng)建了一個(gè)后端服務(wù)。創(chuàng)建每一個(gè)路由都對(duì)應(yīng)一個(gè)。原文地址：https://www.sitepoint.com/creating-crud-app-minutes-angulars-resource 大量的單頁應(yīng)用都有CRUD操作。如果你使...

missonce 2019-08-20 11:21 評(píng)論0 收藏0