title: Forbidden Error In JavaScript Ajax Call in CakePHP 3
body: <p><strong>I have Seen Similar Questions but I could not arrive at the solution. Please help on this code, I am new to javascript</strong></p>
  
  <blockquote>
    <p>My JavaScript Code :</p>
  </blockquote>
  
  <pre><code>function checkId(id_corpus){
  
    var dataSet = {identity_number: id_corpus};
    var requestUrl = appBaseUrl+'users/check-id-presence';
    alert(id_corpus);
     $.ajax({
        type: "POST",
        url: requestUrl,
        data: dataSet,
        success: function(result) {
            if(result == false){
                $('#ino').css('background-color', 'red');
                $('#ino').css('color', 'black');
              }
  
        },
        error: function(jqXHR, textStatus, errorThrown) {
            console.log(textStatus, errorThrown);
        }
    });
    }
  </code></pre>
  
  <blockquote>
    <p>The Above JS code is called by the following CakePHP view:</p>
  </blockquote>
  
  <pre><code>$this-&gt;Form-&gt;input('identity_number', ['style' =&gt; 'background-color : black; color : #1798A5;', 'id' =&gt; 'ino', 'onkeypress' =&gt; 'checkId(this.val)']);
  </code></pre>
  
  <blockquote>
    <p>Following is the controller code</p>
  </blockquote>
  
  <pre><code>public function checkIdPresence()
       {
         $this-&gt;autoRender = false;
         $id_corpus = $this-&gt;request-&gt;data['identity_number'];
         $check = $this-&gt;Users-&gt;find()-&gt;where(['identity_number LIKE' =&gt; '%'.$id_corpus.'%']);
         if((iterator_count($check)) &gt; 0){
           echo false; //Corpus Exists
  
       }else{
  
         echo true;
     }
  }
  </code></pre>
  
  <p><strong>I am stuck in the "Forbidden Error", I would like to bring it to your notice that similar AJAX is being used by me for Image display(as shown below), it is not showing any error:</strong></p>
  
  <pre><code>    function fetch(user_id, photo, photo_dir)
  {
  
  
    var dataSet = {id: user_id};
    var requestUrl = appBaseUrl+'users/admin-side-nav-details';
    var imageUrl = 'http://localhost/media/images/users/photo/'+photo_dir+'/'+'100x100_'+photo;
     $.ajax({
        type: "POST",
        url: requestUrl,
        data: dataSet,
        success: function(result) {
                $('#display_info').html(result);
                var image = "&lt;img src ="+imageUrl+" /&gt;"
                console.log(image);
                $('#display_image').html(image);
  
        },
        error: function(jqXHR, textStatus, errorThrown) {
            console.log(textStatus, errorThrown);
        }
    });
  }
  </code></pre>
  
  <p>EDIT: My <strong>Auth Component setup</strong> :</p>
  
  <pre><code>public function initialize()
    {
    $this-&gt;loadComponent('Auth', [
            'authenticate' =&gt; [
              'Form' =&gt; [
                'fields' =&gt; ['username' =&gt; 'email', 'password' =&gt; 'password']
              ]
            ],
            'loginAction' =&gt; [
                'controller' =&gt; 'Users',
                'action' =&gt; 'login',
            ],
            'authError' =&gt; 'Are you sure, you want to enter?',
            'logoutAction' =&gt; [
              'controller' =&gt; 'Users',
              'action' =&gt; 'login',
            ],
          ]);
  </code></pre>