request is not executed (unkown error)

Question

I am currently developing an angular app with a java backend. So far everything seemed to work, but now I run into an unexplainable issue. There is one GET request that does not work. Everything else works. But funny enough, it only does not work in Firefox.

When I print out the err of the observable this shows in the console:

{
  "headers": {
    "normalizedNames": {},
    "lazyUpdate": null,
    "headers": {}
  },
  "status": 0,
  "statusText": "Unknown Error",
  "url": null,
  "ok": false,
  "name": "HttpErrorResponse",
  "message": "Http failure response for (unknown url): 0 Unknown Error",
  "error": {
    "isTrusted": true
  }
}

When I look in the network tab, the request is not executed. Not even an preflight OPTIONS request.

I red several hints, that i will be a CORS issue. But i believe that's not the case here. My CORS headers are setup properly:

Access-Control-Allow-Headers: X-Requested-With, Content-Type, Authorization
Access-Control-Allow-Methods: GET, POST, DELETE, PUT, OPTIONS, HEAD
Access-Control-Allow-Origin: *
Content-Type: application/json

(usually I would set a more specific domain list for the CORS headers, but I set it set it to '*' just to be sure)

The request that does not work is on the resource /ads/:id. The request on /ads and all other requests work perfectly fine. All resources are realized with Jersey. And the request in question is not subject to any authentication or authorization.

To recap: Only one request only in Firefox does not work. If I go tho the URL directly (not via angular), everything works fine.

I am a little desperate here. Any help is appreciated.

For Clarification:

• there is no error or something else in the developer console (neither in firefox nor chrome)
• there is no request going out the browser in the network tab
• there is no request coming in on the server side
• error above is from console.log(err)
• angular v5.2.9 and HttpClient are used

Narrowing down the Problem

My complete url is http://localhost:8080/api/v1/ads/1. And guess what the problem is the /ads part. I have absolutely no clue what exactly the causes this. I tried several other URLs like /ad /adsf /adsa etc. and all of them worked.

I also narrowed down the Angular to this:

import { Component, OnInit } from '@angular/core';
import { AdService } from '@app/shared/services/ad/ad.service';
import { HttpClient } from '@angular/common/http';

class Ad {
  id: number;
  title: string;
}

@Component({
  selector: 'fwas-ad-detail',
  template: `
  <div *ngIf="isError">
    <h1>Error</h1>
  </div>
  <div *ngIf="!isError">
    <h1>{{ad?.title}}</h1>
  </div>
  `
})
export class AdDetailComponent implements OnInit {

  url = 'http://localhost:8080/api/v1/ads';
  ad: Ad;
  isError = false;

  constructor(private http: HttpClient) { }

  ngOnInit() {
    const queryUrl = this.url + '/' + '1';
    this.http.get<Ad>(queryUrl).subscribe(
      data => { this.ad = data; },
      err => { this.isError = true; }
    );
  }
}

I also tried it with json server which worked fine.

So the problem only exists with the following:

• angular 5 code above
• Firefox 59.0.3 (64-bit)
• Jersey2/Jackson2 API
• And /ads in the URL, but not as last part (http://localhost:8080/api/v1/ads had always worked)

I have found a workaround for me (not using ads in the url) but if someone is bored and wants to figure this out, I would love to know what exactly is the reason for this mystery.