Refused to apply style from 'http://localhost:80/api/index' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

 

>PROBLEM

Attempt to access the server returns:

Refused to apply style from 'http://localhost:80/api/index' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

>SOLUTION 

This kind of issue usually happens because it was not possible to reference the sources.

In this examples, the code was developed using "/" as root URL by the respective spring annotation:

  @RequestMapping("/")   

In this specific case this annotation may be omitted, because the framework assumes it as default, but shown here to clarify.

And the access was:

  http://localhost:8047/

After, the root URL was mapped to "/sg5", using:

  @RequestMapping("/sg5")

And the access was switched:

  http://localhost:8047/sg5

Considering the changes also made in the security layer (in this case the spring security class), it is also required to refactor the static references adding "../" before them.

NOTES: 

1. JavaScript scripts generates CORS messages instead of MIME message. 

To solve, check the example below:

- BEFORE:

<script src="bootstrap/js/bootstrap.min.js"></script>

- SOLUTION: relative path was fixed:

<script src="../bootstrap/js/bootstrap.min.js"></script>

2. Possibly, It may be necessary to update the application's CORS configuration depending of its architecture.

>ENV

springboot

java17

[MYREF]:
y;faq-Refused to apply style from 'http://localhost:8047/sg5/index' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.<memo<springboot;.

linux: docker: docker: Error response from daemon: driver failed programming external connectivity on endpoint

>PROBLEM

Attempt to start a docker container, returns:

  Error response from daemon: driver failed programming external connectivity on endpoint YOUR_CONTAINER_NAME

  (a8dc1e2b183712da69829c9efd642bf2bdcb504556a8dbd3324902adcb79fc3b): (

  iptables failed: iptables --wait -t nat -A DOCKER -p tcp -d 0/0 --dport SOME_PORT_HERE -j DNAT --to-destination 172.17.0.2:8048 ! -i docker0

  : iptables: No chain/target/match by that name. 

   (exit status 1))

  Error: failed to start containers: YOUR_CONTAINER_NAME

>SOLUTION

This kind of issue has more than one cause.
It will be described two of them, very common causes.

1. iptables config

Set the following iptables rule before the others, at the beginning:

  iptables -t nat -A POSTROUTING -o docker0 -j MASQUERADE

2. Restart docker

If you already has set procedure below and if it happens again, try to do:

  systemctl restart docker

>ENV

docker/debian based distributions

[MYREF]:

y;faq-docker: Error response from daemon: driver failed programming external connectivity on endpoint<memo<docker;.

linux: OpenVz: docker: iptables nat issue: iptables v1.8.7 (legacy): can't initialize iptables table `nat': Table does not exist (do you need to insmod?)

 >PROBLEM

Common scenarios:

1. Docker installation fails on Linux distributions,

 or  

2. Attempt to run "iptables -t nat -L -n" command fails.

Both scenarios return the same message:

iptables v1.8.7 (legacy): can't initialize iptables table `nat': Table does not exist (do you need to insmod?)
Perhaps iptables or your kernel needs to be upgraded.

Reason:

Docker uses iptables during installations where the S.O. has this firewall command by default.

>SOLUTION

Make sure that is the case by running the following command:

iptables -t nat -L -n

If it fails, there are two main possibilities.
Choose first the easier one.

- If using a cloud hosting, check with the support service to "enable NatFilter".

or

- Maybe a system upgrade is required, sometimes even the kernel.

A successful test, when the NatFilter is enabled shall return something like this:

$ iptables -t nat -L -n

Chain PREROUTING (policy ACCEPT)

target     prot opt source               destination

Chain INPUT (policy ACCEPT)

target     prot opt source               destination

Chain OUTPUT (policy ACCEPT)

target     prot opt source               destination

Chain POSTROUTING (policy ACCEPT)

target     prot opt source               destination

>ENV

cloud hosting

OpenVz/debian 9-11/Ubunto18-22

MYREF: 
y;faq-iptables v1.8.7 (legacy): can't initialize iptables table `nat': Table does not exist (do you need to insmod?)<memo<linux;.

windows: npm: angular: 'ng' is not recognized as an internal command

 

>PROBLEM

Running the command "ng v", returns:

  'ng' is not recognized as an internal command

  'ng' não é reconhecido como um comando interno  (Portuguese)

>SOLUTION

This procedure is about Windows O.S.

After attempting to solve the problem through other experiences, I got no solution.

My Path seemed to be corrupted and there were no files under the user's folder, for instance at:

  C:\Users\<USER>\AppData\Roaming\npm\node_modules

So, to solve the issue, I decided to restart the environment installation from scratch.

This same procedure were executed several times, including restarting the sytem, until the success came. :-)

1. Uninstall node.js using the windows "Add remove application...".
   
   
2. Remove leftovers. Sometimes there are "skeleton" folder left behind. In my case, it was: C:\Users\<USER>\AppData\Roaming\npm\node_modules
   
   
3. Run the node.js as Administrator. Make sure of that, because it is important.
   
   
4. After the installation is fineshed, check it:
   node --version
   npm --version
   
   
5. Install @angular/cli that it is the lib that provides the "ng" command, as global installation (important: not locally).
   
   
7. The previous command will install the latest version. If you're working with a specific version, go to the angular project's root folder and check the package.json file to verify which version the project is working with: 
   "dependencies": {
    ...
    "@angular/cli": "^13.2.2",  
   ...
   
   
8. Under the project's root folder, install cli using the same version:
   npm install @angular/cli@13.2.2
   
   
9. Eventually, check it the project's env:
   ng v

It shall return the same version used for the project.

>ENV

Angular
Node.js 16

angular: ERROR: TypeError: Cannot read properties of undefined (reading 'valid')

 

>PROBLEM

When the page loads, the browser's console shows the following error:

  ERROR: TypeError: Cannot read properties of undefined (reading 'valid')

>SOLUTION

1. Check if the HTML template uses form validation. For instance: f.form.valid.

Example:

  <button type="submit" class="btn btn-primary" [disabled]="!f.form.valid">Create info</button>

2. Check the form binding.

It shall be something like this:
#f="ngForm"

>BEFORE

        <form name="modalForm" id="modal_create_info_form" #f novalidate

          (ngSubmit)="f.form.valid && createInfo(modalSelector.value)">

>AFTER

        <form name="modalForm" id="modal_create_info_form" #f="ngForm" novalidate

          (ngSubmit)="f.form.valid && createInfo(modalSelector.value)">

3. Make sure that it declared the respective libs:
 

import { FormControl } from '@angular/forms';

or

// import { FormControl, AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';

>ENV

Angular CLI: 13.2.2

Node: 16.13.1

Package Manager: npm 8.5.4

OS: win32 x64

angular: template/component renderization failure

 

>PROBLEM

The template/component fails to renderize (it doesn't appear where it should).

>SOLUTION

Considering an example component in the component.html file: 

<my-component></my-component>

Supposing multi-level modules, declare the component in the first level module.

>firts-level.module.ts

import { MyComponentComponent } from './first level path/MyComponentComponent.component';

@NgModule({

  declarations: [

    // ...

    MyComponentComponent,

  ],

NOTE: if the component has parent-child binding, check also its configuration.

>ENV

Angular CLI: 13.2.2

Node: 16.13.1

Package Manager: npm 8.5.4

OS: win32 x64

angular: Error: Inlining of fonts failed. An error has occurred while retrieving

 

>PROBLEM

Angular compilation fails returning the following message:

  Error: Inlining of fonts failed. An error has occurred while retrieving https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap over the internet.

  getaddrinfo ENOTFOUND fonts.googleapis.com

>SOLUTION

Check your Internet connection.

>ENV

Angular CLI: 13.2.2

Node: 16.13.1

Package Manager: npm 8.5.4

OS: win32 x64