启用 gzip 压缩后嵌入式 Javascript 出现 CORB 错误答案

【问题标题】：CORB error with embedded Javascript after enabling gzip compression启用 gzip 压缩后嵌入式 Javascript 出现 CORB 错误
【发布时间】：2022-02-19 17:09:08
【问题描述】：

我向我的用户提供嵌入代码，以便在他们自己的网站上放置一个小部件。

<div id="myDiv"></div>
<script src="https://www.myserver.com/embed.php?id=sometoken"></script>
<script>Widget.initWidget("myDiv",sometoken);</script>

embed.php 包含以下将 iframe 注入 myDiv 的 javascript 代码

window.Widget= window.Widget|| {
    initWidget: function(id,token) {
        iframe = document.createElement('iframe');
        iframe.setAttribute('src', 'https://www.myserver.com/someother.php?id='&token);
        document.getElementById(id).appendChild(iframe);
    }
}

在我要求我的 VPS 主机启用 gzip 压缩之前，一切正常。他们说他们在 html、javascript 和 css 上启用了 gzip。这导致我的用户收到以下错误

"Cross-Origin Read Blocking (CORB) blocked cross-origin response https://www.myserver.com/embed.php?id=sometoken with MIME type text/html.

他们不明白为什么，所以我要求他们撤消更改。他们做到了，但现在 CORS 问题仍然存在。我要求他们在标题中添加“Access-Control-Allow-Origin：*”，他们这样做了，但问题仍然存在。我不明白他们可能做了什么导致问题，以及为什么他们不能让事情恢复到没有跨源问题时的状态。

这些是正在发送的完整标头：

Access-Control-Allow-Origin: *
Connection: keep-alive
Content-Type: text/html; charset=UTF-8
Date: Sat, 19 Feb 2022 04:28:25 GMT
Server: nginx
Transfer-Encoding: chunked
X-Content-Type-Options: nosniff
X-XSS-Protection: 1; mode=block

我在不同的主机上运行相同的脚本没有问题，它返回这些标头：

Access-Control-Allow-Origin: *
Cache-Control: max-age=0
Connection: Keep-Alive
Content-Type: text/html; charset=utf-8
Date: Sat, 19 Feb 2022 03:23:54 GMT
Expires: Sat, 19 Feb 2022 03:23:54 GMT
Keep-Alive: timeout=3, max=99
Server: Apache
Transfer-Encoding: chunked
X-Content-Type-Options: nosniff
X-UA-Compatible: IE=edge

有什么建议可以告诉托管公司进行更改以使其再次运行吗？

【问题讨论】：

能否提供完整的HTTP请求和响应？ CORB 错误意味着服务器指示的 MIME 类型与浏览器所期望的不匹配 - 例如。如果浏览器请求图像并且它被作为“text/html”提供。

标签： javascript apache nginx cross-origin-read-blocking

【解决方案1】：

服务器说https://www.myserver.com/embed.php?id=sometoken是一个HTML文档。

要么：

它是一个 HTML 文档，您没有得到您期望的内容或
它在撒谎

如果它在撒谎，那么最可能的原因是 PHP 会声称它的输出是 HTML 默认情况下，所以如果你想编写输出其他东西的 PHP，那么你需要明确地这样做。

<?php
    header("Content-Type: text/javascript");
?>

function this_is_JS() { }

【讨论】：