Vanilla JS调用Google Apps Script JSONP接口Edge报CORB错误

方案基本情况 #

• 实现逻辑：搭建简易数据加载链路，拉取Google Sheet内的表格数据完成HTML页面内容填充
• 技术选型：服务端采用Google Apps Script，前端采用原生Vanilla JS实现
• 运行表现：Chrome浏览器中运行完全正常，控制台可正常打印返回的数组内容；Edge浏览器控制台抛出CORB跨域读取拦截错误

服务端Google Apps Script代码 #

function doGet(request) {
  var res = getData();
  return ContentService.createTextOutput(
    request.parameters.prefix + '(' + JSON.stringify(res) + ')')
    .setMimeType(ContentService.MimeType.JAVASCRIPT);
}
 
// 从Google Sheet拉取数据，以数组格式返回
function getData(){
  var spreadSheetId = "mySpreadsheetID";
  var dataRange     = "Projects!A2:J50";
 
  var range   = GoogleSheetsAPI.Spreadsheets.Values.get(spreadSheetId,dataRange);
  return range.values;
}

前端Vanilla JS实现代码 #

var gScriptURL = "https://script.google.com/a/macros/blah/s/blahblahblah/exec?prefix=console.log&dataType=json&callback=?";

var loadJSONP = (function(){
  var unique = 0;
  return function(url, callback, context) {

    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = url;

    window[name] = function(data){
      callback.call((context || window), data);
      document.getElementsByTagName("head")[0].removeChild(script);
      script = null;
      delete window[name];
    };

    document.getElementsByTagName("head")[0].appendChild(script);
  };
})();

function getData(){
    loadJSONP(
    gScriptURL,
    function(data) {
      console.log(data);
    }
  );
}

Edge端报错信息 #

Cross-Origin Read Blocking (CORB) blocked cross-origin response https://url.com/login/login.htm?fromURI=blahblah with MIME type text/html.

核心疑问 #

报错提示拦截的是MIME类型为text/html的跨域响应，但已在服务端显式配置返回MIME类型为JavaScript，前端也按JSONP逻辑发起脚本请求，不确定是否存在配置疏漏，需要定位问题原因与可行解决方案。

内容的提问来源于stack exchange，提问作者GeorgePorge