Resource blocked, MIME type missmatch [Solved]

I cannot load my web interface. In the console log I see that some css and js files have the wrong MIME type and are therefore blocked, due to the X-Content-Type-Options: nosniff header. I am running the nginx congif provided in the docs, for next cloud in the webroot of nginx.

I’ve tried to disable the add_header X-Content-Type-Options "nosniff" always; directive in nginx.conf as well as in the .htaccessfile (as a temporary workaround) but I still get the same issue.

Any suggestions what I can try next?

Firefox console log:

Content Security Policy: The page’s settings blocked the loading of a resource at inline (“script-src”). fingerprint-protection.js:270:52
The resource from “https://example.com/core/css/guest.css?v=72c34c37-0” was blocked due to MIME type (“text/plain”) mismatch (X-Content-Type-Options: nosniff).

The resource from “https://example.com/core/js/dist/main.js?v=72c34c37-0” was blocked due to MIME type (“text/plain”) mismatch (X-Content-Type-Options: nosniff).

Loading failed for the <script> with source “https://example.com/core/js/dist/main.js?v=72c34c37-0”. login:18:1
The resource from “https://example.com/core/search/js/search.js?v=72c34c37-0” was blocked due to MIME type (“text/plain”) mismatch (X-Content-Type-Options: nosniff).

Loading failed for the <script> with source “https://example.com/core/search/js/search.js?v=72c34c37-0”. login:20:1
The resource from “https://example.com/core/search/js/searchprovider.js?v=72c34c37-0” was blocked due to MIME type (“text/plain”) mismatch (X-Content-Type-Options: nosniff).

Loading failed for the <script> with source “https://example.com/core/search/js/searchprovider.js?v=72c34c37-0”. login:21:1
The resource from “https://example.com/core/js/files/fileinfo.js?v=72c34c37-0” was blocked due to MIME type (“text/plain”) mismatch (X-Content-Type-Options: nosniff).

Loading failed for the <script> with source “https://example.com/core/js/files/fileinfo.js?v=72c34c37-0”. login:22:1
The resource from “https://example.com/core/js/files/client.js?v=72c34c37-0” was blocked due to MIME type (“text/plain”) mismatch (X-Content-Type-Options: nosniff).

Loading failed for the <script> with source “https://example.com/core/js/files/client.js?v=72c34c37-0”. login:23:1
The resource from “https://example.com/core/js/dist/maintenance.js?v=72c34c37-0” was blocked due to MIME type (“text/plain”) mismatch (X-Content-Type-Options: nosniff).

Loading failed for the <script> with source “https://example.com/core/js/dist/maintenance.js?v=72c34c37-0”. login:24:1
Uncaught ReferenceError: OC is not defined
    <anonymous> https://example.com/js/core/merged-template-prepend.js?v=72c34c37-0:26

Nextcloud version: 18.0.4.2
Operating system and version : Arch Linux
nginx version: nginx/1.18.0
PHP version: 7.4.11

The output of your config.php file in /path/to/nextcloud (make sure you remove any identifiable information!):

<?php
$CONFIG = array (
  'passwordsalt' => '****',
  'secret' => '*****',
  'trusted_domains' =>
  array (
    0 => 'localhost',
    1 => '*',
  ),
  'datadirectory' => '/data/nextcloud',
  'dbtype' => 'mysql',
  'version' => '18.0.4.2',
  'memcache.local' => '\\OC\\Memcache\\APCu',
  'memcache.distributed' => '\OC\Memcache\Redis',
  'filelocking.enabled' => true,
  'memcache.locking' => '\\OC\\Memcache\\Redis',
  'redis' =>
  array (
    'host' => '/run/redis/redis.sock',
    'port' => 0,
    'dbindex' => 0,
    'timeout' => 0.0,
  ),
  'overwrite.cli.url' => 'http://localhost/nextcloud',
  'dbname' => 'nextcloud',
  'dbhost' => 'localhost',
  'dbport' => '',
  'dbtableprefix' => 'oc_',
  'mysql.utf8mb4' => true,
  'dbuser' => '*****',
  'dbpassword' => '****',
  'installed' => true,
  'instanceid' => '****',
  'maintenance' => true,
  'mail_smtpmode' => 'smtp',
  'mail_smtpsecure' => 'ssl',
  'mail_sendmailmode' => 'smtp',
  'mail_from_address' => '****',
  'mail_domain' => '*****',
  'mail_smtpauth' => 1,
  'mail_smtpport' => '*****',
  'mail_smtphost' => '******',
  'mail_smtpauthtype' => 'LOGIN',
  'mail_smtpname' => '******',
  'mail_smtppassword' => '******',
  'log_type' => 'file',
  'logfile' => '/var/log/nextcloud.log',
  'logfilemode' => 416,
  'loglevel' => 2,
  'preview_libreoffice_path' => '/usr/bin/libreoffice',
  'enable_previews' => true,
  'enabledPreviewProviders' =>
  array (
    0 => 'OC\\Preview\\TXT',
    1 => 'OC\\Preview\\MarkDown',
    2 => 'OC\\Preview\\OpenDocument',
    3 => 'OC\\Preview\\PDF',
    4 => 'OC\\Preview\\MSOffice2003',
    5 => 'OC\\Preview\\MSOfficeDoc',
    6 => 'OC\\Preview\\PDF',
    7 => 'OC\\Preview\\Image',
    8 => 'OC\\Preview\\Photoshop',
    9 => 'OC\\Preview\\TIFF',
    10 => 'OC\\Preview\\SVG',
    11 => 'OC\\Preview\\Font',
    12 => 'OC\\Preview\\MP3',
    13 => 'OC\\Preview\\Movie',
    14 => 'OC\\Preview\\MKV',
    15 => 'OC\\Preview\\MP4',
    16 => 'OC\\Preview\\AVI',
  ),
);

The nginx error.log doesn’t output anything, the access.log doesn’t seem to provide anything interesting either:

192.168.11.1 - - [16/Oct/2020:02:02:06 +0200] "GET /login HTTP/2.0" 503 7423 "-" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:81.0) Gecko/20100101 Firefox/81.0"
192.168.11.1 - - [16/Oct/2020:02:02:06 +0200] "GET /js/core/merged-template-prepend.js?v=72c34c37-0 HTTP/2.0" 200 2950 "-" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:81.0) Gecko/20100101 Firefox/81.0"
192.168.11.1 - - [16/Oct/2020:02:02:06 +0200] "GET /core/img/favicon-touch.png HTTP/2.0" 200 2942 "-" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:81.0) Gecko/20100101 Firefox/81.0"
192.168.11.1 - - [16/Oct/2020:02:02:06 +0200] "GET /core/img/favicon.ico HTTP/2.0" 200 720 "-" "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:81.0) Gecko/20100101 Firefox/81.0"

Turns out I had to include a types directive in the nginx.conf. Nginx provides a mime.types file one can include if you don’t wish to write your own. The location of mime.types is probably different depending on os and distribution but mine was next to my nginx.conf. The standard file includes many types, infact after including it to my conf I got a warning:

could not build optimal types_hash, you should increase either types_hash_max_size: 1024 or types_hash_bucket_size: 64; ignoring types_hash_bucket_size

if you wish to get rid of it, set the types_hash_max_size and/or types_hash_bucket_size to something sufficiently large. In the end I added:

types_hash_max_size 2048;
types_hash_bucket_size 128;
include mime.types;

to my http {} section.