Styjun

Aligning arrays within arrays within another array

2019 2-letters 33-length list

How do you introduce yourself on the phone in a formal setting?

Why can't i use !(single pattern) in zsh even after i turn on kshglob?

SQL Server Ignoring Instance name when using port number of different instance

Why will we fail creating a self sustaining off world colony?

Why is quantum gravity non-renormalizable?

Using quotation marks and exclamation marks

Variable declaration inside main loop

Emphasize numbers in tables

Other homotopy invariants?

What's the difference between the Find Steed and Find Greater Steed spells?

How can I change my buffer system for protein purification?

Why are examinees often not allowed to leave during the start and end of an exam?

Odd PCB Layout for Voltage Regulator

How do I tell my girlfriend she's been buying me books by the wrong author for the last nine months?

Is there a connection between representation theory and PDEs?

Avoiding repetition when using the "snprintf idiom" to write text

I agreed to cancel a long-planned vacation (with travel costs) due to project deadlines, but now the timeline has all changed again

usage of y" not just for locations?

Why doesn't SpaceX land boosters in Africa?

Could citing a database like libgen get one into trouble?

What verb goes with "coup"?

How useful would a hydroelectric power plant be in the post-apocalypse world?

Cross-Origin Read Blocking (CORB) error with Firebase Storage

Why doesn't adding CORS headers to an OPTIONS route allow browsers to access my API?AngularJS performs an OPTIONS HTTP request for a cross-origin resourceWhy does my JavaScript code get a “No 'Access-Control-Allow-Origin' header is present on the requested resource” error when Postman does not?Firefox 'Cross-Origin Request Blocked' despite headersFont from origin has been blocked from loading by Cross-Origin Resource Sharing policyFirebase Storage and Access-Control-Allow-OriginFirebase web: Storage Location from Download URLThird party Javascript blocked (CORB)Write to Firebase Storage with JavaScript gives “Cross-Origin Request Blocked”Download firebase storage file to computer

1

0

I'm using a download URL to get an HTML file from my Firebase Storage and display it in a template. In my template I'm using <img> with the src set to the download URL. The browser shows a broken file and the console says

Cross-Origin Read Blocking (CORB) blocked cross-origin response https://firebasestorage.googleapis.com/v0/b/languagetwo-cd94d.appspot.com/o/English_Videos%2FWalker_Climbs_a_Tree%2Fscript.html?alt=media&token=8772258d-9417-4f93-b16d-29d353c5262

and then the download URL. The download URL works when I put it in a browser window. As the documentation suggested I made this file

[
 
 "origin": "*",
 "method": "GET",
 "maxAgeSeconds": 3600
 
]

named it cors.json, and ran

gsutil cors set cors.json gs://languagetwo-cd94d.appspot.com

I updated gsutil. I cleared my Chrome cache. I tried my app in Chromium. I tried POST instead of GET. I'm still getting the CORB error. What else should I try? Do I need to set Content-Type?

cors google-cloud-storage firebase-storage

share|improve this question

edited Mar 25 at 16:57

Thomas David Kehoe

asked Mar 25 at 15:51

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  “I'm using a download URL to get an HTML file from my Firebase Storage and display it in a template. In my template I'm using <img> with the src set to the download URL.” — Given that, it sounds like the browser is blocking your frontend code from accessing the response because you’re trying to use a text/html response in a context where the browser instead expects an image. Regardless, based on the error message cited in the question, you have a CORB problem, not a CORS problem. So your CORS configuration isn’t going to have any effect either way on this.
  
  – sideshowbarker
  Mar 25 at 17:21
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Thanks stackoverflow.com/users/441757/sideshowbarker, when I get rid of the <img> tag the CORB error message goes away. Now my page displays the download URL. How do I convert the download URL into the HTML file?
  
  – Thomas David Kehoe
  Mar 25 at 17:37
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I'm using $http.get(downloadURL). It's almost working, my template is displaying the file, but the HTML tags are showing as well...
  
  – Thomas David Kehoe
  Mar 25 at 17:45
  

  
  
  
  

add a comment | 

1

0

I'm using a download URL to get an HTML file from my Firebase Storage and display it in a template. In my template I'm using <img> with the src set to the download URL. The browser shows a broken file and the console says

Cross-Origin Read Blocking (CORB) blocked cross-origin response https://firebasestorage.googleapis.com/v0/b/languagetwo-cd94d.appspot.com/o/English_Videos%2FWalker_Climbs_a_Tree%2Fscript.html?alt=media&token=8772258d-9417-4f93-b16d-29d353c5262

and then the download URL. The download URL works when I put it in a browser window. As the documentation suggested I made this file

[
 
 "origin": "*",
 "method": "GET",
 "maxAgeSeconds": 3600
 
]

named it cors.json, and ran

gsutil cors set cors.json gs://languagetwo-cd94d.appspot.com

I updated gsutil. I cleared my Chrome cache. I tried my app in Chromium. I tried POST instead of GET. I'm still getting the CORB error. What else should I try? Do I need to set Content-Type?

cors google-cloud-storage firebase-storage

share|improve this question

edited Mar 25 at 16:57

Thomas David Kehoe

asked Mar 25 at 15:51

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  “I'm using a download URL to get an HTML file from my Firebase Storage and display it in a template. In my template I'm using <img> with the src set to the download URL.” — Given that, it sounds like the browser is blocking your frontend code from accessing the response because you’re trying to use a text/html response in a context where the browser instead expects an image. Regardless, based on the error message cited in the question, you have a CORB problem, not a CORS problem. So your CORS configuration isn’t going to have any effect either way on this.
  
  – sideshowbarker
  Mar 25 at 17:21
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Thanks stackoverflow.com/users/441757/sideshowbarker, when I get rid of the <img> tag the CORB error message goes away. Now my page displays the download URL. How do I convert the download URL into the HTML file?
  
  – Thomas David Kehoe
  Mar 25 at 17:37
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I'm using $http.get(downloadURL). It's almost working, my template is displaying the file, but the HTML tags are showing as well...
  
  – Thomas David Kehoe
  Mar 25 at 17:45
  

  
  
  
  

add a comment | 

I'm using a download URL to get an HTML file from my Firebase Storage and display it in a template. In my template I'm using <img> with the src set to the download URL. The browser shows a broken file and the console says

Cross-Origin Read Blocking (CORB) blocked cross-origin response https://firebasestorage.googleapis.com/v0/b/languagetwo-cd94d.appspot.com/o/English_Videos%2FWalker_Climbs_a_Tree%2Fscript.html?alt=media&token=8772258d-9417-4f93-b16d-29d353c5262

and then the download URL. The download URL works when I put it in a browser window. As the documentation suggested I made this file

[
 
 "origin": "*",
 "method": "GET",
 "maxAgeSeconds": 3600
 
]

named it cors.json, and ran

gsutil cors set cors.json gs://languagetwo-cd94d.appspot.com

I updated gsutil. I cleared my Chrome cache. I tried my app in Chromium. I tried POST instead of GET. I'm still getting the CORB error. What else should I try? Do I need to set Content-Type?

cors google-cloud-storage firebase-storage

share|improve this question

edited Mar 25 at 16:57

Thomas David Kehoe

asked Mar 25 at 15:51

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

Cross-Origin Read Blocking (CORB) blocked cross-origin response https://firebasestorage.googleapis.com/v0/b/languagetwo-cd94d.appspot.com/o/English_Videos%2FWalker_Climbs_a_Tree%2Fscript.html?alt=media&token=8772258d-9417-4f93-b16d-29d353c5262

[
 
 "origin": "*",
 "method": "GET",
 "maxAgeSeconds": 3600
 
]

gsutil cors set cors.json gs://languagetwo-cd94d.appspot.com

share|improve this question

edited Mar 25 at 16:57

Thomas David Kehoe

asked Mar 25 at 15:51

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

share|improve this question

edited Mar 25 at 16:57

Thomas David Kehoe

asked Mar 25 at 15:51

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

asked Mar 25 at 15:51

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

asked Mar 25 at 15:51

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

1 Answer
1

active

oldest

votes

0

sideshowbarker was right, the problem was I was using <img> to display an HTML text file. When I got rid of the <img> tag the CORB error went away. Instead I used $http.get(downloadURL) to get the file, then $sce.trustAsHtml(doc.data); to sanitize the HTML, then in the AngularJS template I used <div ng-bind-html="myFile"></div> to display it in the template. Here's the AngularJS controller code:

firebase.firestore().collection('Videos').doc($scope.longLanguage).collection($scope.longLanguage + '_Videos').doc($scope.movieTitle).collection('Clips').doc($scope.movieTitle + '_999999').get()
 .then(function(doc) 
 $http.get(doc.data().lyricsDownloadURL)
 .then(function(doc) 
 $scope.lyrics = $sce.trustAsHtml(doc.data);
 )
 .catch(error => console.error(error));
 )
 .catch(error => console.error(error));

and here's the AngularJS template:

<div class="col-sm-6 col-md-6 col-lg-6">
 <div ng-bind-html="lyrics"></div>
</div>

share|improve this answer

answered Mar 25 at 17:59

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55341669%2fcross-origin-read-blocking-corb-error-with-firebase-storage%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

0

sideshowbarker was right, the problem was I was using <img> to display an HTML text file. When I got rid of the <img> tag the CORB error went away. Instead I used $http.get(downloadURL) to get the file, then $sce.trustAsHtml(doc.data); to sanitize the HTML, then in the AngularJS template I used <div ng-bind-html="myFile"></div> to display it in the template. Here's the AngularJS controller code:

firebase.firestore().collection('Videos').doc($scope.longLanguage).collection($scope.longLanguage + '_Videos').doc($scope.movieTitle).collection('Clips').doc($scope.movieTitle + '_999999').get()
 .then(function(doc) 
 $http.get(doc.data().lyricsDownloadURL)
 .then(function(doc) 
 $scope.lyrics = $sce.trustAsHtml(doc.data);
 )
 .catch(error => console.error(error));
 )
 .catch(error => console.error(error));

and here's the AngularJS template:

<div class="col-sm-6 col-md-6 col-lg-6">
 <div ng-bind-html="lyrics"></div>
</div>

share|improve this answer

answered Mar 25 at 17:59

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

add a comment | 

0

sideshowbarker was right, the problem was I was using <img> to display an HTML text file. When I got rid of the <img> tag the CORB error went away. Instead I used $http.get(downloadURL) to get the file, then $sce.trustAsHtml(doc.data); to sanitize the HTML, then in the AngularJS template I used <div ng-bind-html="myFile"></div> to display it in the template. Here's the AngularJS controller code:

firebase.firestore().collection('Videos').doc($scope.longLanguage).collection($scope.longLanguage + '_Videos').doc($scope.movieTitle).collection('Clips').doc($scope.movieTitle + '_999999').get()
 .then(function(doc) 
 $http.get(doc.data().lyricsDownloadURL)
 .then(function(doc) 
 $scope.lyrics = $sce.trustAsHtml(doc.data);
 )
 .catch(error => console.error(error));
 )
 .catch(error => console.error(error));

and here's the AngularJS template:

<div class="col-sm-6 col-md-6 col-lg-6">
 <div ng-bind-html="lyrics"></div>
</div>

share|improve this answer

answered Mar 25 at 17:59

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

add a comment | 

sideshowbarker was right, the problem was I was using <img> to display an HTML text file. When I got rid of the <img> tag the CORB error went away. Instead I used $http.get(downloadURL) to get the file, then $sce.trustAsHtml(doc.data); to sanitize the HTML, then in the AngularJS template I used <div ng-bind-html="myFile"></div> to display it in the template. Here's the AngularJS controller code:

firebase.firestore().collection('Videos').doc($scope.longLanguage).collection($scope.longLanguage + '_Videos').doc($scope.movieTitle).collection('Clips').doc($scope.movieTitle + '_999999').get()
 .then(function(doc) 
 $http.get(doc.data().lyricsDownloadURL)
 .then(function(doc) 
 $scope.lyrics = $sce.trustAsHtml(doc.data);
 )
 .catch(error => console.error(error));
 )
 .catch(error => console.error(error));

and here's the AngularJS template:

<div class="col-sm-6 col-md-6 col-lg-6">
 <div ng-bind-html="lyrics"></div>
</div>

share|improve this answer

answered Mar 25 at 17:59

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

firebase.firestore().collection('Videos').doc($scope.longLanguage).collection($scope.longLanguage + '_Videos').doc($scope.movieTitle).collection('Clips').doc($scope.movieTitle + '_999999').get()
 .then(function(doc) 
 $http.get(doc.data().lyricsDownloadURL)
 .then(function(doc) 
 $scope.lyrics = $sce.trustAsHtml(doc.data);
 )
 .catch(error => console.error(error));
 )
 .catch(error => console.error(error));

<div class="col-sm-6 col-md-6 col-lg-6">
 <div ng-bind-html="lyrics"></div>
</div>

share|improve this answer

answered Mar 25 at 17:59

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

answered Mar 25 at 17:59

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges

answered Mar 25 at 17:59

Thomas David KehoeThomas David Kehoe

2,65111 gold badge1616 silver badges4444 bronze badges