link2329 link2330 link2331 link2332 link2333 link2334 link2335 link2336 link2337 link2338 link2339 link2340 link2341 link2342 link2343 link2344 link2345 link2346 link2347 link2348 link2349 link2350 link2351 link2352 link2353 link2354 link2355 link2356 link2357 link2358 link2359 link2360 link2361 link2362 link2363 link2364 link2365 link2366 link2367 link2368 link2369 link2370 link2371 link2372 link2373 link2374 link2375 link2376 link2377 link2378 link2379 link2380 link2381 link2382 link2383 link2384 link2385 link2386 link2387 link2388 link2389 link2390 link2391 link2392 link2393 link2394 link2395 link2396 link2397 link2398 link2399 link2400 link2401 link2402 link2403 link2404 link2405 link2406 link2407 link2408 link2409 link2410 link2411 link2412 link2413 link2414 link2415 link2416 link2417 link2418 link2419 link2420 link2421 link2422 link2423 link2424 link2425 link2426 link2427 link2428 link2429 link2430 link2431 link2432 link2433 link2434 link2435 link2436 link2437 link2438 link2439 link2440 link2441 link2442 link2443 link2444 link2445 link2446 link2447 link2448 link2449 link2450 link2451 link2452 link2453 link2454 link2455 link2456 link2457 link2458 link2459 link2460 link2461 link2462 link2463 link2464 link2465

[Vue.js] Cannot recieve Post data sent from Vue via axios to PHP

devs. when running a local apache server. There are static vue.js files and ‘print’ folder with some script. when trying to send an http request from vue.js (via axios) to ‘print’ folder.

there is tried to use vue-resourse to send data, but I had the same problem.

Here is a vue.js method:

postData: function() {
const data = {
firstName: “John”,
lastName: “Doe”
};
const config = {
headers: {
“Content-Type”: “application/x-www-form-urlencoded”
}
};
axios
.post(“/print”, data, config)
.then(function(response) {
console.log(response);
})
.catch(function(error) {
console.log(error);
});
}

The index.php file from print folder:

<?php
$postBody = file_get_contents(“php://input”);
$postBody = json_encode($postBody);
echo ‘Post: ‘,$postBody, ‘ here’;

Here are some screensots from network tab (sorry for quality)
when not sure why devtools treats request like GET, but I use POST

When I log the response into console it looks like that. Here the response is actually POST. But the data is still missing.

Prview tab looks like that.

Request actually reaches the file, but $postBody is simply an empty string. I guees the problem is that (“php://input”) does not get any input. When echo count($_POST) 0 is returned. Thanks for any help..

Solution :

There’s a couple of problems here which I’ll address in order.

You are sending JSON, not application/x-www-form-urlencoded so remove that Content-type request header. Axios defaults to application/json
Axios by default expects the response to be JSON but the PHP script is responding with plain text. Change the config to

const config = {
responseType: ‘text’
}

You are using json_encode() where you should be using json_decode(). The former turns a PHP data structure into a JSON-formatted string. The latter does the opposite.
On a hunch, if you’re using something like

<form @submit=”postData” action=”/print”>

then you need to change it to

<form @submit.prevent=”postData”>

to prevent the form from submitting normally. Same goes for if you’re using a form submit button with @click handler. That or use type=”button” so it won’t submit by default.

See https://vuejs.org/v2/guide/events.html#Event-Modifiers
the web server may be performing a redirect from /print to /print/index.php, transforming the POST request to GET. To be sure this doesn’t happen, use the full path in the URL.
Assuming everything works in the PHP, $postBody will be an instance of stdclass, the result of json_decode(). Attempting to echo that out won’t work very well. In fact, it will trigger an error like

Recoverable fatal error: Object of class stdClass could not be converted to string

but the error reporting level may not be set correctly for you to see. See How to get useful error messages in PHP?

If you’d just like to re-show the JSON, try

$postBody = json_decode(file_get_contents(‘php://input’)); // returns a stdclass
echo ‘Post: ‘, json_encode($postBody), ‘ here’;

Note that the response will not be valid JSON due to the “Post: “ and “ here” output.