如何通过Ajax调用Zendesk Ticket Create API创建工单？附代码求助

Let's walk through the issues in your code and fix them one by one to get that Zendesk ticket creation working:

1. Wrong API Endpoint #

First off, you're using the URL for fetching a single existing ticket (/api/v2/tickets/1.json), but to create a new ticket, you need the tickets collection endpoint instead:

url: 'https://xxxx.zendesk.com/api/v2/tickets.json'

2. Missing Authentication #

Zendesk's API won't let you create tickets without proper authorization. For frontend testing (note: this isn't ideal for production due to security risks), you can use basic authentication with your Zendesk email and API token:

• Encode your credentials in the format your_zendesk_email/token:your_api_token to Base64. You can generate this in your browser console with btoa("you@example.com/token:your_api_token").
• Add an Authorization header to your Ajax call to pass the encoded credentials:

headers: {
  'Authorization': 'Basic ' + btoa("you@example.com/token:your_api_token")
}

Critical production note: Never expose your API token in frontend code—anyone can steal it. Instead, set up a backend proxy that handles authentication and forwards the request to Zendesk.

3. CORS Restrictions #

Browsers block cross-origin requests by default, so your frontend call will fail unless you take one of these steps:

• Option 1: Configure CORS in your Zendesk admin panel (Settings > Security > CORS) to allow your frontend domain.
• Option 2: Use your own backend server to proxy the request (the safer, production-ready approach).

4. Improved Error Handling #

Your current error alerts are vague—let's update the callback to show detailed info that helps debug issues like auth failures or invalid payloads:

error: function(xhr, status, error) {
  alert(`Error creating ticket:\nStatus: ${status}\nError: ${error}\nDetails: ${xhr.responseText}`);
}

Full Corrected Code #

Here's the updated code with all fixes applied:

<script type="text/javascript">
$(function() {
  $("#btnGet").click(function() {
    $.ajax({
      url: 'https://xxxx.zendesk.com/api/v2/tickets.json', // Corrected endpoint
      contentType: 'application/json',
      type: 'POST',
      headers: {
        // Replace with your encoded credentials
        'Authorization': 'Basic ' + btoa("your_zendesk_email/token:your_zendesk_api_token")
      },
      data: JSON.stringify({
        "ticket": {
          "subject": "Test SUB",
          "comment": {
            "body": "Test BODY"
          }
        }
      }),
      success: function(response) {
        alert("Success! Ticket created with ID: " + response.ticket.id);
      },
      error: function(xhr, status, error) {
        alert(`Error creating ticket:\nStatus: ${status}\nError: ${error}\nDetails: ${xhr.responseText}`);
      }
    });
  });
});
</script>

Final Checks #

• Double-check that your Zendesk API token has "Write" permissions for tickets.
• If using a backend proxy, ensure it forwards the Content-Type header and handles authentication correctly.

内容的提问来源于stack exchange，提问作者ghanshyam chavda