Add charset to contentType when supported (#226)

Author: ofhouse

packages/deploy-trigger/package.json

@@ -16,12 +16,12 @@
     "postpack": "rm ./LICENSE ./third-party-licenses.txt"
   },
   "dependencies": {
-    "mime": "^2.4.6"
+    "mime-types": "^2.1.33"
   },
   "devDependencies": {
     "@types/archiver": "^5.1.0",
     "@types/aws-lambda": "^8.10.76",
-    "@types/mime": "^2.0.2",
+    "@types/mime-types": "^2.1.1",
     "@types/tmp": "^0.2.0",
     "@types/unzipper": "^0.10.3",
     "@vercel/ncc": "^0.27.0",

packages/deploy-trigger/src/__test__/deploy-trigger.test.ts

@@ -90,15 +90,17 @@ describe('deploy-trigger', () => {
         .getObject({ Bucket: targetBucket.bucketName, Key: staticRouteKey })
         .promise();
 
-      expect(staticRouteObject.ContentType).toBe('text/html');
+      expect(staticRouteObject.ContentType).toBe('text/html; charset=utf-8');
       expect(staticRouteObject.CacheControl).toBe(
         'public,max-age=0,must-revalidate,s-maxage=31536000'
       );
 
       const staticAssetObject = await s3
         .getObject({ Bucket: targetBucket.bucketName, Key: staticAssetKey })
         .promise();
-      expect(staticAssetObject.ContentType).toBe('application/javascript');
+      expect(staticAssetObject.ContentType).toBe(
+        'application/javascript; charset=utf-8'
+      );
       expect(staticAssetObject.CacheControl).toBe(
         'public,max-age=31536000,immutable'
       );

packages/deploy-trigger/src/deploy-trigger.ts

@@ -1,23 +1,31 @@
 import { S3 } from 'aws-sdk';
 import unzipper from 'unzipper';
-import { getType } from 'mime';
+import {
+  lookup as mimeLookup,
+  contentType as mimeContentType,
+} from 'mime-types';
 
 import { deploymentConfigurationKey } from './constants';
 import { generateRandomBuildId } from './utils';
 import { FileResult } from './types';
 
 // Metadata Key where the buildId is stored
 const BuildIdMetaDataKey = 'x-amz-meta-tf-next-build-id';
-// Immutable files like css, js, images with hashed file names
+
+/**
+ * Cache control header for immutable files that are stored in _next/static
+ */
 const CacheControlImmutable = 'public,max-age=31536000,immutable';
-// Static pre-rendered HTML routes
-// -
-// Must be refetched by the browser every time (max-age=0)
-// But CloudFront CDN can hold the copy infinite time until a invalidation
-// removes it (s-maxage=31536000)
-// https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/Expiration.html#ExpirationDownloadDist
-const CacheControlStaticHtml =
-  'public,max-age=0,must-revalidate,s-maxage=31536000';
+
+/**
+ * Static files that have no hashed filenames
+ *
+ * Must be refetched by the browser every time (max-age=0).
+ * But CloudFront CDN can hold the copy infinite time until a invalidation
+ * removes it (s-maxage=31536000).
+ * https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/Expiration.html#ExpirationDownloadDist
+ */
+const CacheControlStatic = 'public,max-age=0,must-revalidate,s-maxage=31536000';
 
 interface Props {
   s3: S3;
@@ -77,17 +85,26 @@ export async function deployTrigger({
       // Get ContentType
       // Static pre-rendered pages have no file extension,
       // files without extension get HTML mime type as fallback
-      const ContentType = getType(fileName) || 'text/html';
+      const mimeType = mimeLookup(fileName);
+      const contentType =
+        typeof mimeType === 'string' ? mimeContentType(mimeType) : false;
+
+      // When the file is static (served from /_next/*) then it has immutable
+      // client - side caching).
+      // Otherwise it is only immutable on the CDN
+      const cacheControl = fileName.startsWith('_next/')
+        ? CacheControlImmutable
+        : CacheControlStatic;
 
       const uploadParams: S3.Types.PutObjectRequest = {
         Bucket: deployBucket,
         Key: fileName,
         Body: entry,
-        ContentType,
-        CacheControl:
-          ContentType === 'text/html'
-            ? CacheControlStaticHtml
-            : CacheControlImmutable,
+        ContentType:
+          typeof contentType === 'string'
+            ? contentType
+            : 'text/html; charset=utf-8',
+        CacheControl: cacheControl,
       };
 
       // Sorry, but you cannot override the manifest

yarn.lock

@@ -956,10 +956,10 @@
     jest-diff "^27.0.0"
     pretty-format "^27.0.0"
 
-"@types/mime@^2.0.2":
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/@types/mime/-/mime-2.0.2.tgz#857a118d8634c84bba7ae14088e4508490cd5da5"
-  integrity sha512-4kPlzbljFcsttWEq6aBW0OZe6BDajAmyvr2xknBG92tejQnvdGtT9+kXSZ580DqpxY9qG2xeQVF9Dq0ymUTo5Q==
+"@types/mime-types@^2.1.1":
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/@types/mime-types/-/mime-types-2.1.1.tgz#d9ba43490fa3a3df958759adf69396c3532cf2c1"
+  integrity sha512-vXOTGVSLR2jMw440moWTC7H19iUyLtP3Z1YTj7cSsubOICinjMxFeb/V57v9QdyyPGbbWolUFSSmSiRSn94tFw==
 
 "@types/minimatch@*":
   version "3.0.3"
@@ -3173,17 +3173,24 @@ mime-db@1.44.0:
   resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.44.0.tgz#fa11c5eb0aca1334b4233cb4d52f10c5a6272f92"
   integrity sha512-/NOTfLrsPBVeH7YtFPgsVWveuL+4SjjYxaQ1xtM1KMFj7HdxlBlxeyNLzhyJVx7r4rZGJAZ/6lkKCitSc/Nmpg==
 
+mime-db@1.50.0:
+  version "1.50.0"
+  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.50.0.tgz#abd4ac94e98d3c0e185016c67ab45d5fde40c11f"
+  integrity sha512-9tMZCDlYHqeERXEHO9f/hKfNXhre5dK2eE/krIvUjZbS2KPcqGDfNShIWS1uW9XOTKQKqK6qbeOci18rbfW77A==
+
 mime-types@^2.1.12:
   version "2.1.27"
   resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.27.tgz#47949f98e279ea53119f5722e0f34e529bec009f"
   integrity sha512-JIhqnCasI9yD+SsmkquHBxTSEuZdQX5BuQnS2Vc7puQQQ+8yiP5AY5uWhpdv4YL4VM5c6iliiYWPgJ/nJQLp7w==
   dependencies:
     mime-db "1.44.0"
 
-mime@^2.4.6:
-  version "2.4.6"
-  resolved "https://registry.yarnpkg.com/mime/-/mime-2.4.6.tgz#e5b407c90db442f2beb5b162373d07b69affa4d1"
-  integrity sha512-RZKhC3EmpBchfTGBVb8fb+RL2cWyw/32lshnsETttkBAyAUXSGHxbEJWWRXc751DrIxG1q04b8QwMbAwkRPpUA==
+mime-types@^2.1.33:
+  version "2.1.33"
+  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.33.tgz#1fa12a904472fafd068e48d9e8401f74d3f70edb"
+  integrity sha512-plLElXp7pRDd0bNZHw+nMd52vRYjLwQjygaNg7ddJ2uJtTlmnTCjWuPKxVu6//AdaRuME84SvLW91sIkBqGT0g==
+  dependencies:
+    mime-db "1.50.0"
 
 mimic-fn@^2.1.0:
   version "2.1.0"