Welcome Guest, Not a member yet? Register   Sign In
CSRF vuejs-axios not working
#1

Hi,
Spending hours to post some vuejs - axios data to my codeigniter.


PHP Code:
axios({
method'post',
url'http://puppyplaza.dev/api/saveprofile',
data: {
    
csrf_token'b2897db3f48b2c08c7313f280b290eb3',
    
emailthis.profile.email
}
}) 


In my config the token name is "csrf_token".  csrf_regenerate is FALSE just to simplify the problem.
http://puppyplaza.dev/api/save profile is a for now a simple controller to display the result (on my localhost)

PHP Code:
    public function saveprofile()
    {
        
$data = array('data'=> 'data to send back to browser');
        
$this->load->helper('security');
        
//$this->input->post('csrf_token'); 
        //$csrf =  $this->security->get_csrf_hash();
        
$this->output
        
->set_content_type('application/json')
        ->
set_output(json_encode(array('data' => $data'csrf' => $csrf)));

    } 

With Jquery it works Smile
data: {'csrf_token':'b2897db3f48b2c08c7313f280b290eb3'},

With axios it wont!

[Image: error.png]


Please, please anyone!?
Reply
#2

After hours of of research I came up with the idea to check the security class.

Somehow the json post data from axios, or Superagent, or $http.post from my Vuejs file returns an empty ARRAY.


So the checkup for the CSRF token is always false because there is no data!
Therefore, if the $_POST is empty I check if there is any raw post input data and decode it


By extending the Security core class, adding MY_Security.php to application/core
PHP Code:
<?php
class MY_Security extends CI_Security{

public function 
csrf_verify(){
<?
php
class MY_Security extends CI_Security{

public function 
csrf_verify(){ 

Copied the csrf_verify function from the original


PHP Code:
//if the $_POST array is empty, check for $raw_input_stream / php://input
 
if(!$_POST){
  
$_POST json_decode(file_get_contents("php://input"), true);
 }
 
// Check CSRF token validity, but don't error on mismatch just yet - we'll want to regenerate
 
$valid = isset($_POST[$this->_csrf_token_name], $_COOKIE[$this->_csrf_cookie_name])
 && 
hash_equals($_POST[$this->_csrf_token_name], $_COOKIE[$this->_csrf_cookie_name]); 


Is there a better approach for this problem?
Reply
#3

(10-12-2017, 02:50 AM)ponzo Wrote: After hours of of research I came up with the idea to check the security class.

Somehow the json post data from axios, or Superagent, or $http.post from my Vuejs file returns an empty ARRAY.


So the checkup for the CSRF token is always false because there is no data!
Therefore, if the $_POST is empty I check if there is any raw post input data and decode it


By extending the Security core class, adding MY_Security.php to application/core
PHP Code:
<?php
class MY_Security extends CI_Security{

public function 
csrf_verify(){
<?
php
class MY_Security extends CI_Security{

public function 
csrf_verify(){ 

Copied the csrf_verify function from the original


PHP Code:
//if the $_POST array is empty, check for $raw_input_stream / php://input
 
if(!$_POST){
 
 $_POST json_decode(file_get_contents("php://input"), true);
 }
 
// Check CSRF token validity, but don't error on mismatch just yet - we'll want to regenerate
 
$valid = isset($_POST[$this->_csrf_token_name], $_COOKIE[$this->_csrf_cookie_name])
 && 
hash_equals($_POST[$this->_csrf_token_name], $_COOKIE[$this->_csrf_cookie_name]); 


Is there a better approach for this problem?

https://github.com/axios/axios#using-app...ded-format

Quote:By default, axios serializes JavaScript objects to JSON. To send data in the application/x-www-form-urlencoded format instead, you can use one of the following options.

https://github.com/axios/axios/issues/362
I hope it help you a little bit. I do not know if it work.

If you need help, i can make an example today/tomorrow.
Reply
#4

Don't know if this thread is still active... just found it after writing https://forum.codeigniter.com/thread-74671.html
Maybe helpful for new people ending up here
Reply




Theme © iAndrew 2016 - Forum software by © MyBB