第二次调用 jquery 时出现 403 AJAX 错误

Question

I have a simple form with a select field of clients. Once you select a client, i am making an ajax call to fetch the clients logo and display below the select field for the user to see. This works fine. The AJAX request looks like this:

$.ajax({
  url: '/clients/access_controls/<?php echo basename(__FILE__);?>',
  type: 'post',
  data: clientId,
  //dataType: 'application/json',
  //contentType: 'application/x-www-form-urlencoded',

  error: function(jqXhr, textStatus, errorMessage) {
    alert('ERROR MESSAGE: ' + errorMessage);
    return false;
  },

  success: function(d) {
    $(d.html).insertAfter(tab.find('table tr:eq(0)'));
    var func = d.responseScript;
    if ($.isFunction(eval(func))) {
      eval(func + '()');
    }
  }
});

The problem is, once i select another client from the list, the Ajax call returns an error of 403 FORBIDDEN. What could be the issue? What baffles me is the first call goes fine, so why does it fail the second time. Its a very simple issue, but i have not been able to fix it. I have tried setting different content types with the request, and also tried setting "Access-Control" headers on the PHP file processing the request like so:

header('Content-type: application/json');
//header('Access-Control-Allow-Headers', 'api-key,content-type');

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method");
//header('content-type: application/x-www-form-urlencoded; charset=UTF-8');

to no avail. Any help will be appreciated. Thanks in advance.

Here's the php CODE

if (isset($_POST['request'])) {
  if (isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
    header('Content-type: application/json');
    //header('Access-Control-Allow-Headers', 'api-key,content-type');

    //header('Access-Control-Allow-Origin: *');
    //header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method");
    //header('content-type: application/x-www-form-urlencoded; charset=UTF-8');

}

switch ($_POST['request']) {
    case 'logos':
        if (!isset($_POST['sub'], $_POST['value'])) {
            echo json_encode([
                'error' => 'Invalid arguments'
            ]);
            exit;
        }

        $logo = getClientLogo($_POST['value']);
        $html = '<tr><td valign="top">Current Logo:</td><td valign="top" class="client_logo">' . ((!empty($logo)) ? $logo : '<strong>No Logo</strong>') . '</td></tr><tr><td>Upload new logo:</td><td><form method="post" enctype="multipart/form-data" target="member_image" action="/clients/access_controls/' . basename(__FILE__) . '"><input type="file" name="member_image" class="hidden" /><input type="button" value="Select File" data-usage="member_image" data-event="click" data-label="member_filename" />&nbsp;&nbsp;<span class="member_filename">No file selected</span>&nbsp;&nbsp;<input type="submit" value="Upload &amp; Save &gt;" /><input type="hidden" name="request" value="image_upload" /><input type="hidden" name="value" value="' . $_POST['value'] . '" /><input type="hidden" name="iil_token" value="' . getCSRFToken() . '" /></form><input name="member_image" style="display: none;" /></td></tr>';
        print json_encode([
            'html' => $html,
            'responseScript' => 'IIL.applyImageUploadRequirements'
        ]);
        exit;

Answer 1

If you have Mod Security - try turning it off & see if that works. I recently had trouble getting 403 errors from an ajax call to a php script - it would give a 403 if the content contained the word 'include'. Turning off mod-security got it working until we found the rule that was at fault.

Answer 2

For anyone who might find this beneficial, @Dylan Hamilton-Foster i would say you were close-as in, it was a security check issue. However, my specific situation was unique. Here's the thing; in our in-house framework, we fire a csrf code generated from the same page with every form submitted, and check for it in the processing script. When one first visits the page, the csrf code is sent and so it matches and the request is allowed through. But because the second form submission happens without the page refreshing, no csrf is sent through and so the csrf verification script on the processing side rejects the request.

My solution was basically to set a counter variable and post it with every request (alongside the csrf token) and then increment it on subsequent requests. In the processing script, i modified the token verification to accept the counter variable if it is present.

I know this is unsafe and defeats the purpose of using a CSRF token, but

a) this app was only used internally, and was within our corporate firewall

b) this was a legacy application with the same script being used by multiple other in-house applications, so i wanted to make the least change possible.

There you go. It worked well.