Merge pull request #34810 from cbothner/activestorage-no-undefined-csrf-header

ActiveStorage: Don’t include an undefined X-CSRF-Token header when creating a blob record

3 files changed, 15 insertions, 2 deletions

diff --git a/activestorage/CHANGELOG.md b/activestorage/CHANGELOG.md
index 99f1ef9d86..51890f308b 100644
--- a/activestorage/CHANGELOG.md
+++ b/activestorage/CHANGELOG.md
@@ -1,3 +1,8 @@
+*   It doesn’t include an `X-CSRF-Token` header if a meta tag is not found on
+    the page. It previously included one with a value of `undefined`.
+
+    *Cameron Bothner*
+
 *   Fix `ArgumentError` when uploading to amazon s3
 
     *Hiroki Sanpei*
diff --git a/activestorage/app/assets/javascripts/activestorage.js b/activestorage/app/assets/javascripts/activestorage.js
index b71e251a11..e2bcb520b9 100644
--- a/activestorage/app/assets/javascripts/activestorage.js
+++ b/activestorage/app/assets/javascripts/activestorage.js
@@ -560,7 +560,10 @@
       this.xhr.setRequestHeader("Content-Type", "application/json");
       this.xhr.setRequestHeader("Accept", "application/json");
       this.xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
-      this.xhr.setRequestHeader("X-CSRF-Token", getMetaValue("csrf-token"));
+      var csrfToken = getMetaValue("csrf-token");
+      if (csrfToken != undefined) {
+        this.xhr.setRequestHeader("X-CSRF-Token", csrfToken);
+      }
       this.xhr.addEventListener("load", function(event) {
         return _this.requestDidLoad(event);
       });
diff --git a/activestorage/app/javascript/activestorage/blob_record.js b/activestorage/app/javascript/activestorage/blob_record.js
index ff847892b2..7fbe315f76 100644
--- a/activestorage/app/javascript/activestorage/blob_record.js
+++ b/activestorage/app/javascript/activestorage/blob_record.js
@@ -17,7 +17,12 @@ export class BlobRecord {
     this.xhr.setRequestHeader("Content-Type", "application/json")
     this.xhr.setRequestHeader("Accept", "application/json")
     this.xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest")
-    this.xhr.setRequestHeader("X-CSRF-Token", getMetaValue("csrf-token"))
+
+    const csrfToken = getMetaValue("csrf-token")
+    if (csrfToken != undefined) {
+      this.xhr.setRequestHeader("X-CSRF-Token", csrfToken)
+    }
+
     this.xhr.addEventListener("load", event => this.requestDidLoad(event))
     this.xhr.addEventListener("error", event => this.requestDidError(event))
   }