問題描述

所以我正在嘗試從 Javascript 發布到我的服務器 (php)，并且嘗試不使用 JQuery.

So I'm trying to POST to my server (php) from Javascript and am trying to not use JQuery.

此代碼工作并將必要的數據發布到數據庫

This code works and posts the necessary data to the database

var msg = {};
msg['name'] = 'joe';
msg['message'] = 'why no work';

$.post(phpURL, msg, function(data) {});

但這個沒有

var xhr = new XMLHttpRequest();
xhr.open("POST", phpURL, true);
xhr.send(msg);

我什至查看了我的 php 日志，查看了標題，我能看到的 JQuery 與 XHR 的唯一區別是內容類型標題 "application/x-www-form-urlencoded;charset=UTF-8" 和這個頭 "x-requested-with"XMLHttpRequest".

I even looked at my php logs, looked at the headers and the only difference of the JQuery one from the XHR one I could see was the content-type header "application/x-www-form-urlencoded; charset=UTF-8" and this header "x-requested-with" "XMLHttpRequest".

所以我嘗試了以下標題的所有組合.

So I tried all combinations of the following headers.

var xhr = new XMLHttpRequest();
xhr.open("POST", phpURL, true);
//xhr.setRequestHeader('Content-Type', 'application/json');
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
//xhr.setRequestHeader('x-requested-with', 'XMLHttpRequest');
xhr.send(msg);

沒有效果.

值得一提的是，如果我嘗試在任何地方添加 JSON.stringify(msg)，它不起作用，無論是在 JQuery 還是 XHR 中.但我想先讓這個工作，并解釋這個奇怪的差異.

It is worth mentioning if I try to add JSON.stringify(msg) anywhere, it does not work, neither in JQuery or XHR. But I would like to get this working first, and explain this bizarre difference.

我傾向于認為這是一個 Javascript 問題，因為 JQuery 帖子有效，此外，服務器的 GET 請求和我嘗試發布到的同一個表也有效.

I am inclined to believe this is a Javascript issue since the JQuery post works and in addition, a GET request of the server and the same table I'm trying to post to does work.

推薦答案

不要將 JavaScript 對象與 JSON 混淆.

如果您將對象傳遞給 jQuery 的 data 參數，那么它會將其編碼為 application/x-www-form-urlencoded 數據(不是 JSON！).

If you pass an object to jQuery's data parameter then it will encode it as application/x-www-form-urlencoded data (not JSON!).

如果您將 application/x-www-form-urlencoded 數據發布到 PHP，那么它將解析它并用它填充 $_POST 超全局.

If you POST application/x-www-form-urlencoded data to PHP then it will parse it and populate the $_POST superglobal with it.

如果您將對象傳遞給 XMLHttpRequest 對象的 send() 方法，那么它將不為您編碼.它會隱式調用 .toString() 并發送任何有用的東西.

If you pass an object to the send() method of an XMLHttpRequest object then it will not encode it for you. It will invoke .toString() on it implicit and send nothing very useful at all.

要達到與 jQuery 相同的效果，您需要 自己編碼數據.不要忘記同時設置 Content-Type 標頭！

To achieve the same effect as jQuery will do then you need to encode the data yourself. Don't forget to also set the Content-Type header!

const encoded = new URLSearchParams(Object.entries(msg)).toString();
const xhr = new XMLHttpRequest();
xhr.open("POST", phpURL, true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(encoded);

如果您想發送 JSON，那么您還必須對其進行編碼，但這只需使用 JSON.stringify() 雖然您還需要設置 Content-Type 標頭(到 application/json 這次).

const encoded = JSON.stringify(msg);
const xhr = new XMLHttpRequest();
xhr.open("POST", phpURL, true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.send(encoded);

<?php 
    $json = file_get_contents('php://input');
    $msg = json_decode($json);