Ajax预检请求返回无效HTTP状态码404问题求助

Hey there, let's work through this cross-origin AJAX issue you're dealing with. I know you've already tried CORS plugins and tweaking headers, so let's break down what's actually going wrong here.

What's Causing the 404? #

When you send a cross-domain request with custom headers, browsers first fire off a preflight OPTIONS request to the server. This is the browser's way of checking if the server allows cross-origin calls from your client. The 404 error means your server isn't set up to handle this OPTIONS request at the http://localhost:8000/auth/github endpoint.

Postman works because it doesn't enforce the same preflight rules as browsers—it sends the GET request directly without that preliminary check.

A Quick Fix to Your Client Code #

First, let's clean up your AJAX request: you shouldn't be sending the Access-Control-Allow-Origin header from the client. That header is meant to be returned by the server in its response, not included in your request. You can also drop crossDomain: true since jQuery automatically handles that for cross-origin calls. Here's the simplified version:

$.ajax({
  type:'GET',
  url:'http://localhost:8000/auth/github',
  headers:{
    'Content-Type':'application/x-www-form-urlencoded'
  },
  success:function(data){debugger;}
});

Solutions to Resolve the Preflight 404 #

• Handle OPTIONS Requests on the Server
  You need to configure your server to respond to OPTIONS requests at the /auth/github route with the proper CORS headers. The response should include:

  • Access-Control-Allow-Origin: * (or restrict it to your specific client origin for better security)
  • Access-Control-Allow-Methods: GET, OPTIONS
  • Access-Control-Allow-Headers: Content-Type

  For example, if you're using Node.js/Express, you could use the cors middleware and configure it for this route specifically, or add a manual handler for OPTIONS requests.

• Verify Your Server Route
  Double-check that the /auth/github route is correctly defined on your server. Typos or mismatched route patterns can lead to 404s, even if Postman seems to work (make sure you're using the exact same URL in both Postman and your AJAX request!).

• Disable CORS Plugins Temporarily
  Sometimes CORS browser plugins can interfere with preflight checks. Try disabling them while testing your fixes—the server should handle CORS natively once configured correctly.

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