Steps performed at glance:
- Angular 10 build step
- Nginx docker container build and push step
- AWS ECS service restart to refresh public container
Error received on endpoint:
GEThttp://<aws load balancer endpoint (masked)>/runtime.js
[HTTP/1.1 404 Not Found 71ms]
GEThttp://<aws load balancer endpoint (masked)>/polyfills.js
[HTTP/1.1 404 Not Found 55ms]
GEThttp://<aws load balancer endpoint (masked)>/styles.js
[HTTP/1.1 404 Not Found 67ms]
GEThttp://<aws load balancer endpoint (masked)>/vendor.js
[HTTP/1.1 404 Not Found 66ms]
GEThttp://<aws load balancer endpoint (masked)>/main.js
[HTTP/1.1 404 Not Found 105ms]
The resource from “http://<aws load balancer endpoint (masked)>/polyfills.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
<aws load balancer endpoint (masked)>
Loading failed for the <script> with source “http://<aws load balancer endpoint (masked)>/polyfills.js”. <aws load balancer endpoint (masked)>:12:1
The resource from “http://<aws load balancer endpoint (masked)>/runtime.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
<aws load balancer endpoint (masked)>
Loading failed for the <script> with source “http://<aws load balancer endpoint (masked)>/runtime.js”. <aws load balancer endpoint (masked)>:12:1
The resource from “http://<aws load balancer endpoint (masked)>/styles.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
<aws load balancer endpoint (masked)>
Loading failed for the <script> with source “http://<aws load balancer endpoint (masked)>/styles.js”. <aws load balancer endpoint (masked)>:12:1
The resource from “http://<aws load balancer endpoint (masked)>/vendor.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
<aws load balancer endpoint (masked)>
Loading failed for the <script> with source “http://<aws load balancer endpoint (masked)>/vendor.js”. <aws load balancer endpoint (masked)>:12:1
The resource from “http://<aws load balancer endpoint (masked)>/main.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
<aws load balancer endpoint (masked)>
Loading failed for the <script> with source “http://<aws load balancer endpoint (masked)>/main.js”. <aws load balancer endpoint (masked)>:12:1
GEThttp://<aws load balancer endpoint (masked)>/favicon.ico
dockerfile:
FROM nginx:1.17.1-alpine
COPY nginx.conf /etc/nginx/nginx.conf
COPY mime.types /etc/nginx/mime.types
COPY security-headers.conf /etc/nginx/security-headers.conf
COPY /dist/payload-ng /usr/dist/nginx/html
nginx.conf:
user nginx;
worker_processes 1;
worker_rlimit_nofile 8192;
events {
worker_connections 1024;
}
http {
include /etc/nginx/mime.types;
default_type application/octet-stream;
server_names_hash_bucket_size 128;
sendfile on;
server {
listen 80;
server_name localhost;
root /usr/dist/nginx/html;
index index.html;
location / {
try_files $uri$args $uri$args/ /index.html;
add_header Cache-Control 'max-age=86400'; # one day
include /etc/nginx/security-headers.conf;
}
location ~ .*\.css$|.*\.js$ {
add_header Cache-Control 'max-age=31449600'; # one year
include /etc/nginx/security-headers.conf;
}
location ~ /index.html|.*\.json$ {
expires -1;
add_header Cache-Control 'no-store, no-cache, must-revalidate,
proxy-revalidate, max-age=0';
}
}
}
mime.types:
types {
# Data interchange
application/atom+xml atom;
application/json json map topojson;
application/ld+json jsonld;
application/rss+xml rss;
application/vnd.geo+json geojson;
application/xml rdf xml;
# JavaScript
# Normalize to standard type.
# https://tools.ietf.org/html/rfc4329#section-7.2
application/javascript js;
# Manifest files
application/manifest+json webmanifest;
application/x-web-app-manifest+json webapp;
text/cache-manifest appcache;
# Media files
audio/midi mid midi kar;
audio/mp4 aac f4a f4b m4a;
audio/mpeg mp3;
audio/ogg oga ogg opus;
audio/x-realaudio ra;
audio/x-wav wav;
image/bmp bmp;
image/gif gif;
image/jpeg jpeg jpg;
image/png png;
image/svg+xml svg svgz;
image/tiff tif tiff;
image/vnd.wap.wbmp wbmp;
image/webp webp;
image/x-jng jng;
video/3gpp 3gpp 3gp;
video/mp4 f4v f4p m4v mp4;
video/mpeg mpeg mpg;
video/ogg ogv;
video/quicktime mov;
video/webm webm;
video/x-flv flv;
video/x-mng mng;
video/x-ms-asf asx asf;
video/x-ms-wmv wmv;
video/x-msvideo avi;
# Serving `.ico` image files with a different media type
# prevents Internet Explorer from displaying then as images:
# https://github.com/h5bp/html5-boilerplate/commit/37b5fec090d00f38de64b591bcddcb205aadf8ee
image/x-icon cur ico;
# Microsoft Office
application/msword doc;
application/vnd.ms-excel xls;
application/vnd.ms-powerpoint ppt;
application/vnd.openxmlformats-officedocument.wordprocessingml.document docx;
application/vnd.openxmlformats-officedocument.spreadsheetml.sheet xlsx;
application/vnd.openxmlformats-officedocument.presentationml.presentation pptx;
# Web fonts
application/font-woff woff;
application/font-woff2 woff2;
application/vnd.ms-fontobject eot;
# Browsers usually ignore the font media types and simply sniff
# the bytes to figure out the font type.
# https://mimesniff.spec.whatwg.org/#matching-a-font-type-pattern
#
# However, Blink and WebKit based browsers will show a warning
# in the console if the following font types are served with any
# other media types.
application/x-font-ttf ttc ttf;
font/opentype otf;
# Other
application/java-archive jar war ear;
application/mac-binhex40 hqx;
application/octet-stream bin deb dll dmg exe img iso msi msm msp safariextz;
application/pdf pdf;
application/postscript ps eps ai;
application/rtf rtf;
application/vnd.google-earth.kml+xml kml;
application/vnd.google-earth.kmz kmz;
application/vnd.wap.wmlc wmlc;
application/x-7z-compressed 7z;
application/x-bb-appworld bbaw;
application/x-bittorrent torrent;
application/x-chrome-extension crx;
application/x-cocoa cco;
application/x-java-archive-diff jardiff;
application/x-java-jnlp-file jnlp;
application/x-makeself run;
application/x-opera-extension oex;
application/x-perl pl pm;
application/x-pilot prc pdb;
application/x-rar-compressed rar;
application/x-redhat-package-manager rpm;
application/x-sea sea;
application/x-shockwave-flash swf;
application/x-stuffit sit;
application/x-tcl tcl tk;
application/x-x509-ca-cert der pem crt;
application/x-xpinstall xpi;
application/xhtml+xml xhtml;
application/xslt+xml xsl;
application/zip zip;
text/css css;
text/html html htm shtml;
text/mathml mml;
text/plain txt;
text/vcard vcard vcf;
text/vnd.rim.location.xloc xloc;
text/vnd.sun.j2me.app-descriptor jad;
text/vnd.wap.wml wml;
text/vtt vtt;
text/x-component htc;
}
security-headers.conf:
add_header X-Content-Type-Options "nosniff" always;
add_header Feature-Policy "microphone 'none'; geolocation 'none'; camera 'none'" always;
At this point i am not sure what is the cause of getting the mime type error, double checked if the lates image is runing in ECS. Nginx is a new stack i am getting familiar with and lacking of oversight on this matter, and i would appreciate help with it. My best knowledge is it should serv the js files with the proper "text/javascript" header, but i can be easily wrong. I appreciate any input.