0
143
Viewsfetch response 404 but page exists
I'm have this Fetch code (POST) but the response says status: 404 even though when I open the url in the browser, the page exists and returns a JSON. when I changed the url to https://httpbin.org/post it returns a normal data.. and when I use the same url but with GET method (without any init parameters for the fetch method) it returns status: 200.
what am I doing wrong?
when I open the url in the browser:
php controller
/*
* filepath: application/modules/test/controllers/test.php
*/
public function homepage()
{
$this->load->view('home', $this->data);
}
public function get_result()
{
$response = [
'status' => 0,
'message' => 'abcde',
];
echo json_encode($response);
}
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<input type="button" id="btn1" value="Button1">
<script src="/assets/js/test_fetch.js"></script>
</body>
</html>
javascript
/*
* filepath: /assets/js/test_fetch.js
*/
/*!
* Filename: test_fetch.js
* Tanggal: 20220214
* Author: david santana
* script utk belajar ttg penggunaan fetch API
* Copyright Gotravelly.com@2022
*/
const myBtn1 = document.querySelector('#btnSubmit');
console.log(myBtn1);
myBtn1.addEventListener('click', function() {
// fetch data from server
const url = '/test/get_results';
// const url = 'https://httpbin.org/post';
let myData = {
user_id: 123,
name: 'david',
};
fetch(url, {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
// 'Content-Type': 'application/x-www-form-urlencoded',
},
body: JSON.stringify(myData)
})
.then(response => console.log(response));
});
1 answers
Answer question0
never mind, my colleague pointed out to me that I didn't add the csrf and I need to use FormData in the body parameter.. after I tried it, it works!
but then I tried to use Object with the same csrf key-value pair like this, but it doesn't work
let myData = {
user_id: 123,
name: 'david',
};
let csrf_name = document.querySelector('#csrf').attributes['name'].value;
let csrf = document.querySelector('#csrf').value;
myData[csrf_name] = csrf;
which brings me to a new question (if I may ask a follow-up question): does POST needs to always use a FormData as body parameter?