Hey there, let's break down how to fix this CORS issue you're hitting when trying to log in from your Angular app to your WildFly backend. That 403 on the OPTIONS preflight request tells us the server isn't properly set up to accept cross-origin requests from your Angular origin (http://localhost:4200). Here's a step-by-step guide to troubleshoot and resolve this:

1. Fix WildFly's Server-Wide CORS Configuration #

WildFly 9 requires explicit CORS setup in its server config. Head to your standalone.xml or domain.xml file and update the undertow subsystem to include a CORS filter:

<subsystem xmlns="urn:jboss:domain:undertow:2.0">
  <server name="default-server">
    <host name="default-host" alias="localhost">
      <filter-ref name="cors-filter" predicate="true"/>
    </host>
  </server>
  <filters>
    <filter name="cors-filter" class-name="io.undertow.servlet.handlers.CorsHandler">
      <param name="allowedOrigins" value="http://localhost:4200"/>
      <param name="allowedMethods" value="GET, POST, PUT, DELETE, OPTIONS"/>
      <param name="allowedHeaders" value="Content-Type, Authorization"/>
      <param name="allowCredentials" value="true"/>
    </filter>
  </filters>
</subsystem>

Don't forget to restart WildFly after saving these changes.

2. Verify Application-Level CORS Filter (If Used) #

If you're handling CORS at the app level instead of server-wide, make sure your filter correctly handles OPTIONS preflight requests. A common mistake is not returning a 200 OK for these calls. Here's an example Java Servlet filter:

@WebFilter("/*")
public class CorsFilter implements Filter {
    @Override
    public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) res;
        HttpServletRequest request = (HttpServletRequest) req;
        
        // Allow your Angular origin
        response.setHeader("Access-Control-Allow-Origin", "http://localhost:4200");
        response.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
        response.setHeader("Access-Control-Allow-Headers", "Content-Type, Authorization");
        response.setHeader("Access-Control-Allow-Credentials", "true");
        
        // Handle preflight OPTIONS request immediately
        if ("OPTIONS".equalsIgnoreCase(request.getMethod())) {
            response.setStatus(HttpServletResponse.SC_OK);
            return;
        }
        
        chain.doFilter(req, res);
    }
}

3. Double-Check Origin Matching #

Your Angular app's origin is http://localhost:4200, which matches the Origin header in your request. Ensure the allowedOrigins value in your config matches this exactly—no trailing slashes, and correct protocol (http vs https). If you need to allow multiple origins, use a comma-separated list (avoid * if you're using credentials, as it conflicts with allowCredentials: true).

4. Dig Into WildFly's Logs #

Check WildFly's server logs (usually in wildfly-9.0.2.Final/standalone/log/server.log) for detailed error messages about why the CORS request was rejected. The logs often reveal missing headers or origin mismatches that aren't clear from the HTTP response.

5. Test with Curl to Rule Out Angular Issues #

To confirm the problem is on the server side, send a preflight request directly with curl:

curl -X OPTIONS http://127.0.0.1:8088/myproduct/login \
     -H "Origin: http://localhost:4200" \
     -H "Access-Control-Request-Method: POST" \
     -H "Access-Control-Request-Headers: content-type" \
     -v

If the response doesn't include Access-Control-Allow-Origin and other required CORS headers, your server config isn't being applied correctly.

6. Check for Conflicting Security Filters #

If you have other security filters (like CSRF or authentication filters) in your app or server, they might block the OPTIONS request before the CORS filter can process it. Ensure the CORS filter is the first in the filter chain so it handles the request early.

Let me know if any of these steps help you resolve the issue!

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