Unity WebGL palaišana ar ASP.NET Core

Lapa atjaunota : Piektdiena, 2023. gada 29. septembris

Lapas izveides datums : Ceturtdiena, 2022. gada 24. marts

Verifikācijas vide

Windows

Operētājsistēmā Windows 11

Vienotības redaktors

2020.3.25f1

Visual Studio

Visual Studio 2022

ASP.NET kodols

ASP.NET kodols 6.0

Interneta informācijas pakalpojumi (IIS)

IIS 10.0

Sākumā

Uzziniet, kā palaist spēles izvadi kā WebGL in Unity tīmekļa serverī ASP.NET kurā darbojas Core. Spēļu programmām izmantojiet tos, kas tiek izvadīti tālāk norādītajās padomu darbībās. Spēles piemērā tiek izmantota 2D Platformer Microgame, kuru var izveidot no Unity Hub.

Tīmekļa optimizētas (WebGL) spēles izvade

Es paskaidrošu, kā iestatīt "Nesaspiests WebGL", "WebGL, kas saspiests ar Gzip" un "WebGL saspiests ar Brotli", lai palaistu WebGL spēles. Procedūra ir vienāda visiem.

Mēs izmantojam Visual Studio 2022, ASP.NET Core 6.0, taču, iespējams, darbosies vecākas versijas. Tomēr sākotnējā koda struktūra katrai versijai ir atšķirīga, tāpēc, lūdzu, saprotiet atšķirības pats.

ASP.NET pamatprojekta izveide

Sākuma izvēlnē palaidiet "Visual Studio 2022".

Atlasiet Izveidot jaunu projektu.

Šoreiz kā paraugu atlasiet "ASP.NET Core Web App". Ja izmantojat ASP.NET Core, varat palaist citas veidnes, taču katrai veidnei ir jāseko līdzi tās izveidei.

Patvaļīgi iestatiet projekta nosaukumu un atrašanās vietu.

Atstājiet papildu informāciju tādu, kāda tā ir.

Projekts ir izveidots.

Nesaspiesta WebGL palaišana

Sagatavojiet WebGL programmu, kas izveidota bez saspiešanas.

Pārliecinieties, vai spēle darbojas ātri

ASP.NET Mēģiniet palaist WebGL spēli ar mazāk iestatījumiem, neievērojot Core etiķeti.

Programmā ASP.NET Core nevar piekļūt dažiem WebGL failiem, ko Unity emitē noklusējuma stāvoklī. Padariet to pieejamu.

Programmā.cs

Atveriet no sava Program.cs projekta. Attiecas uz vecākām ASP.NET Core versijām Startup.cs .

Koda augšdaļā pievienojiet nosaukumvietu un kodā app.UseStaticFiles(); aizstājiet šādu tekstu:

// ここから追加
using Microsoft.AspNetCore.StaticFiles;
// ここまで追加

var builder = WebApplication.CreateBuilder(args);

// --- 省略 ---

app.UseHttpsRedirection();

//app.UseStaticFiles();
// ここから追加
var provider = new FileExtensionContentTypeProvider();
provider.Mappings[".data"] = "application/octet-stream";
provider.Mappings[".wasm"] = "application/wasm";

app.UseStaticFiles(new StaticFileOptions()
{
  ContentTypeProvider = provider,
});
// ここまで追加

app.UseRouting();

// --- 省略 ---

.data, lai, piekļūstot failam, .wasm to varētu atgriezt klientam ar norādīto Content-Type .

WebGL izvietošana

Ievietojiet savā projektā wwwroot šādas failu mapes no Unity .

indekss.html
Veidot
VeidnesDati

Index.cshtmlindex.html Atveriet saiti, lai tai varētu piekļūt.

<!-- 省略 -->

<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

<!-- 追加 -->
<a href="index.html">index.html</a>

Palaidiet programmu un pārliecinieties, vai spēle darbojas.

WebGL programmas palaišana Razor lapā

Iepriekšējā spēle darbojās statiskā HTML failā, tāpēc tā darbojas vietā, kurai nav nekāda sakara ar ASP.NET Core. Tas nav ļoti vēlams programmas vienveidībai, tāpēc mēs pārvietosim HTML faila darbību uz Razor Pages.

Ar peles labo pogu noklikšķiniet uz projekta mapes Lapas, lai pievienotu jaunu vienumu.

Atlasiet Skuvekļa lapa - tukša. Nav norādīts konkrēts nosaukums, bet tas ir pievienots šeit WebGL.cshtml .

Tiek parādīts kods.

index.html Skatiet faila saturu un portu uz WebGL.cshtml . link Ir daži dīvaini punkti, piemēram, kā ievietot tagu, bet es to atstāšu, kā tas ir izskaidrojuma vienkāršības labad.

@page
@model UnityPublishWebglAspNetCore.Pages.WebGLModel
@{
}

<div id="unity-container" class="unity-desktop">
  <canvas id="unity-canvas" width=960 height=600></canvas>
  <div id="unity-loading-bar">
    <div id="unity-logo"></div>
    <div id="unity-progress-bar-empty">
      <div id="unity-progress-bar-full"></div>
    </div>
  </div>
  <div id="unity-warning"> </div>
  <div id="unity-footer">
    <div id="unity-webgl-logo"></div>
    <div id="unity-fullscreen-button"></div>
    <div id="unity-build-title">Platformer</div>
  </div>
</div>

@section Scripts {
  <link rel="shortcut icon" href="TemplateData/favicon.ico">
  <link rel="stylesheet" href="TemplateData/style.css">
  <script>
    var container = document.querySelector("#unity-container");
    var canvas = document.querySelector("#unity-canvas");
    var loadingBar = document.querySelector("#unity-loading-bar");
    var progressBarFull = document.querySelector("#unity-progress-bar-full");
    var fullscreenButton = document.querySelector("#unity-fullscreen-button");
    var warningBanner = document.querySelector("#unity-warning");

    // 一時的なメッセージバナー/リボンを数秒間表示するか、
    // type == 'error'の場合はキャンバスの上部に永続的なエラーメッセージを表示します。
    // type == 'warning'の場合、黄色のハイライト色が使用されます。
    // この関数を変更または削除して、重要ではない警告とエラーメッセージがユーザーに表示されるように
    // 視覚的に表示される方法をカスタマイズします。
    function unityShowBanner(msg, type) {
      function updateBannerVisibility() {
        warningBanner.style.display = warningBanner.children.length ? 'block' : 'none';
      }
      var div = document.createElement('div');
      div.innerHTML = msg;
      warningBanner.appendChild(div);
      if (type == 'error') div.style = 'background: red; padding: 10px;';
      else {
        if (type == 'warning') div.style = 'background: yellow; padding: 10px;';
        setTimeout(function() {
          warningBanner.removeChild(div);
          updateBannerVisibility();
        }, 5000);
      }
      updateBannerVisibility();
    }

    var buildUrl = "Build";
    var loaderUrl = buildUrl + "/WebGL.loader.js";
    var config = {
      dataUrl: buildUrl + "/WebGL.data",
      frameworkUrl: buildUrl + "/WebGL.framework.js",
      codeUrl: buildUrl + "/WebGL.wasm",
      streamingAssetsUrl: "StreamingAssets",
      companyName: "DefaultCompany",
      productName: "Platformer",
      productVersion: "2.1.0",
      showBanner: unityShowBanner,
    };

    // デフォルトでは、Unity は WebGL キャンバスレンダリングのターゲットサイズを
    // キャンバス要素の DOM サイズ（window.devicePixelRatio でスケーリング）と一致させます。
    // この同期がエンジン内で発生しないようにする場合は、これを false に設定し、
    // 代わりにサイズを大きくします。 キャンバスの DOM サイズと WebGL は、
    // ターゲットサイズを自分でレンダリングします。
    // config.matchWebGLToCanvasSize = false;

    if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
      container.className = "unity-mobile";
      // モバイルデバイスでフィルレートのパフォーマンスを低下させないようにし、
      // モバイルブラウザで低 DPI モードをデフォルト/オーバーライドします。
      config.devicePixelRatio = 1;
      unityShowBanner('WebGL builds are not supported on mobile devices.');
    } else {
      canvas.style.width = "960px";
      canvas.style.height = "600px";
    }
    loadingBar.style.display = "block";

    var script = document.createElement("script");
    script.src = loaderUrl;
    script.onload = () => {
      createUnityInstance(canvas, config, (progress) => {
        progressBarFull.style.width = 100 * progress + "%";
      }).then((unityInstance) => {
        loadingBar.style.display = "none";
        fullscreenButton.onclick = () => {
          unityInstance.SetFullscreen(1);
        };
      }).catch((message) => {
        alert(message);
      });
    };
    document.body.appendChild(script);
  </script>
}

Index.cshtmlWebGL Saites pievienošana uz .

<!-- 省略 -->

<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

<!-- 追加 -->
<ul>
  <li><a href="index.html">index.html</a></li>
  <li><a href="WebGL">WebGL</a></li>
</ul>

Mēģiniet palaist programmu. Jūs varat redzēt, ka galvene un kājene _Layout.cshtml tiek parādīta WebGL lapā saskaņā ar .

WebGL failu atrašanās vietas maiņa

Es ievietoju WebGL failu tieši zem , bet šī metode to pārrakstīs, kad ievietosit divus vai vairākus WebGL wwwroot failus. Es paskaidrošu, kā to ievietot atsevišķās mapēs un pārvietot.

Pirmkārt, izveidojiet jaunu mapi ar nosaukumu "webgl" un pārvietojiet to tur. Divas pārvietojamās Buildmapes ir , TemplateData . index.html Es to jau esmu pārnesis uz Razor Pages un varu to droši izdzēst.

Tā kā WebGL.cshtml mēs esam padziļinājuši mapju hierarhiju, mēs arī padziļināsim ceļu, kas aprakstīts . Korekcija ir 3 rindas.

Pirms korekcijas

<link rel="shortcut icon" href="TemplateData/favicon.ico">
<link rel="stylesheet" href="TemplateData/style.css">

    var buildUrl = "Build";

Pēc korekcijas

<link rel="shortcut icon" href="webgl/TemplateData/favicon.ico">
<link rel="stylesheet" href="webgl/TemplateData/style.css">

    var buildUrl = "webgl/Build";

Palaidiet programmu, lai redzētu, vai tā darbojas pareizi.

WebGL palaišana saspiesta ar Gzip

Gzip saspiestā faila paplašinājums ir , un tas ir .gz fails, kuru var apstrādāt ASP.NET Core, Unity WebGL, Content-Type un tie tiek apstrādāti atšķirīgi, un tiem ir nepieciešama konvertēšana.

Vispirms izveidojiet WebGL failu izvietojumu un lapu.

WebGL failu izvietojums

wwwrootwebgl-gzip Izveidojiet mapi zem Gzip un nokopējiet mapi , no WebGL failaBuildTemplateData, kuru izveidojāt, izmantojot Gzip.

Izveidojiet skuvekļa lapu

Šoreiz WebGLGzip.cshtml izveidojiet failu, izmantojot to pašu procedūru kā tad, ja tas ir nesaspiests.

Kods ir šāds, atsaucoties uz Vienotības izlaidi index.html . Ceļš atbilst mapei, kuru iepriekš izveidojāt webgl-gzip WebGL failiem.

@page
@model UnityPublishWebglAspNetCore.Pages.WebGLGzipModel
@{
}

<div id="unity-container" class="unity-desktop">
  <canvas id="unity-canvas" width=960 height=600></canvas>
  <div id="unity-loading-bar">
    <div id="unity-logo"></div>
    <div id="unity-progress-bar-empty">
      <div id="unity-progress-bar-full"></div>
    </div>
  </div>
  <div id="unity-warning"> </div>
  <div id="unity-footer">
    <div id="unity-webgl-logo"></div>
    <div id="unity-fullscreen-button"></div>
    <div id="unity-build-title">Platformer</div>
  </div>
</div>

@section Scripts {
  <link rel="shortcut icon" href="webgl-gzip/TemplateData/favicon.ico">
  <link rel="stylesheet" href="webgl-gzip/TemplateData/style.css">
  <script>
    var container = document.querySelector("#unity-container");
    var canvas = document.querySelector("#unity-canvas");
    var loadingBar = document.querySelector("#unity-loading-bar");
    var progressBarFull = document.querySelector("#unity-progress-bar-full");
    var fullscreenButton = document.querySelector("#unity-fullscreen-button");
    var warningBanner = document.querySelector("#unity-warning");

    // 一時的なメッセージバナー/リボンを数秒間表示するか、
    // type == 'error'の場合はキャンバスの上部に永続的なエラーメッセージを表示します。
    // type == 'warning'の場合、黄色のハイライト色が使用されます。
    // この関数を変更または削除して、重要ではない警告とエラーメッセージがユーザーに表示されるように
    // 視覚的に表示される方法をカスタマイズします。
    function unityShowBanner(msg, type) {
      function updateBannerVisibility() {
        warningBanner.style.display = warningBanner.children.length ? 'block' : 'none';
      }
      var div = document.createElement('div');
      div.innerHTML = msg;
      warningBanner.appendChild(div);
      if (type == 'error') div.style = 'background: red; padding: 10px;';
      else {
        if (type == 'warning') div.style = 'background: yellow; padding: 10px;';
        setTimeout(function() {
          warningBanner.removeChild(div);
          updateBannerVisibility();
        }, 5000);
      }
      updateBannerVisibility();
    }

    var buildUrl = "webgl-gzip/Build";
    var loaderUrl = buildUrl + "/WebGL_Gzip.loader.js";
    var config = {
      dataUrl: buildUrl + "/WebGL_Gzip.data.gz",
      frameworkUrl: buildUrl + "/WebGL_Gzip.framework.js.gz",
      codeUrl: buildUrl + "/WebGL_Gzip.wasm.gz",
      streamingAssetsUrl: "StreamingAssets",
      companyName: "DefaultCompany",
      productName: "Platformer",
      productVersion: "2.1.0",
      showBanner: unityShowBanner,
    };

    // デフォルトでは、Unity は WebGL キャンバスレンダリングのターゲットサイズを
    // キャンバス要素の DOM サイズ（window.devicePixelRatio でスケーリング）と一致させます。
    // この同期がエンジン内で発生しないようにする場合は、これを false に設定し、
    // 代わりにサイズを大きくします。 キャンバスの DOM サイズと WebGL は、
    // ターゲットサイズを自分でレンダリングします。
    // config.matchWebGLToCanvasSize = false;

    if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
      container.className = "unity-mobile";
      // モバイルデバイスでフィルレートのパフォーマンスを低下させないようにし、
      // モバイルブラウザで低 DPI モードをデフォルト/オーバーライドします。
      config.devicePixelRatio = 1;
      unityShowBanner('WebGL builds are not supported on mobile devices.');
    } else {
      canvas.style.width = "960px";
      canvas.style.height = "600px";
    }
    loadingBar.style.display = "block";

    var script = document.createElement("script");
    script.src = loaderUrl;
    script.onload = () => {
      createUnityInstance(canvas, config, (progress) => {
        progressBarFull.style.width = 100 * progress + "%";
      }).then((unityInstance) => {
        loadingBar.style.display = "none";
        fullscreenButton.onclick = () => {
          unityInstance.SetFullscreen(1);
        };
      }).catch((message) => {
        alert(message);
      });
    };
    document.body.appendChild(script);
  </script>
}

Modificējiet, lai atļautu navigāciju uz Index.cshtml šo lapu.

<!-- 省略 -->

<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

<!-- 追加 -->
<ul>
  <li><a href="index.html">index.html</a></li>
  <li><a href="WebGL">WebGL</a></li>
  <li><a href="WebGLGzip">WebGLGzip</a></li>
</ul>

Fiksēšanas programma.cs

app.UseStaticFiles Modificējiet daļu, kas apstrādā metodi, šādi.

Pirms korekcijas

// ここから追加
var provider = new FileExtensionContentTypeProvider();
provider.Mappings[".data"] = "application/octet-stream";
provider.Mappings[".wasm"] = "application/wasm";

app.UseStaticFiles(new StaticFileOptions()
{
  ContentTypeProvider = provider,
});
// ここまで追加

Pēc korekcijas

// ここから追加
var provider = new FileExtensionContentTypeProvider();
provider.Mappings[".data"] = "application/octet-stream";
provider.Mappings[".wasm"] = "application/wasm";
provider.Mappings[".br"] = "application/octet-stream";   // .br ファイルにアクセスできるように追加
provider.Mappings[".js"] = "application/javascript";     // 後の変換の為に追加

app.UseStaticFiles(new StaticFileOptions()
{
  ContentTypeProvider = provider,
  OnPrepareResponse = context =>
  {
    var path = context.Context.Request.Path.Value;
    var extension = Path.GetExtension(path);

    // 「.gz」「.br」ファイルにアクセスした場合は Content-Type と Content-Encoding を設定する
    if (extension == ".gz" || extension == ".br")
    {
      var fileNameWithoutExtension = Path.GetFileNameWithoutExtension(path) ?? "";
      if (provider.TryGetContentType(fileNameWithoutExtension, out string? contentType))
      {
        context.Context.Response.ContentType = contentType;
        context.Context.Response.Headers.Add("Content-Encoding", extension == ".gz" ? "gzip" : "br");
      }
    }
  },
});
// ここまで追加

Programmā ASP.NET Core .gz fails Content-Type application/x-gzip atgriežas ar . Kā tas ir, Unity WebGL uz klienta to nevar noteikt, tāpēc .gz es to pārrakstīju un atgriezu atbilstoši Content-Type faila paplašinājumam, kas izslēdz . Content-Encoding Es arī to iestatīju, jo tas gzip ir nepieciešams.

Starp citu, es arī ievietoju Brotli kodu kopā, lai jūs varētu izmantot šo kodu, kā tas ir nākamā vienuma Brotli sarakstē. Brotli arī .br iestata pārrakstīšanu Content-Encoding br, lai tā atbilstu Content-Type faila paplašinājumam bez . Tomēr fails pēc noklusējuma nav pieejams ASP.NET Core,.br tāpēc provider.Mappings es to pievienoju ar .br .

Pēc tam palaidiet atkļūdošanu un pārbaudiet, vai spēle darbojas pareizi.

Ja esat to pareizi iestatījis un spēle joprojām netiek rādīta, mēģiniet notīrīt tīmekļa pārlūkprogrammas kešatmiņu, lai notīrītu sīkfailus.

WebGL palaišana, kas saspiesta ar Brotli

Procedūra ir gandrīz tāda pati kā Gzip, aizstājot Gzip daļu ar Brotli. Tomēr Brotli (.br) faili pēc noklusējuma nav pieejami ASP.NET Core. Jums tas ir jākonfigurē tā, lai jūs varētu tam piekļūt, bet, ja izmantojat kodu Gzip laikā, tas tiek atbalstīts.

Vispirms izveidojiet WebGL failu izvietojumu un lapu.

WebGL failu izvietojums

wwwrootwebgl-brotli Sadaļā Izveidot mapi kopējiet mapi , no BuildTemplateData WebGL faila, ko izveidojāt, izmantojot Brotli.

Izveidojiet skuvekļa lapu

Izveidojiet failu, veicot WebGLBrotli.cshtml tādas pašas darbības kā Gzip.

Kods ir šāds, atsaucoties uz Vienotības izlaidi index.html . Ceļš atbilst mapei, kuru iepriekš izveidojāt webgl-brotli WebGL failiem.

@page
@model UnityPublishWebglAspNetCore.Pages.WebGLBrotliModel
@{
}

<div id="unity-container" class="unity-desktop">
  <canvas id="unity-canvas" width=960 height=600></canvas>
  <div id="unity-loading-bar">
    <div id="unity-logo"></div>
    <div id="unity-progress-bar-empty">
      <div id="unity-progress-bar-full"></div>
    </div>
  </div>
  <div id="unity-warning"> </div>
  <div id="unity-footer">
    <div id="unity-webgl-logo"></div>
    <div id="unity-fullscreen-button"></div>
    <div id="unity-build-title">Platformer</div>
  </div>
</div>

@section Scripts {
  <link rel="shortcut icon" href="webgl-brotli/TemplateData/favicon.ico">
  <link rel="stylesheet" href="webgl-brotli/TemplateData/style.css">
  <script>
    var container = document.querySelector("#unity-container");
    var canvas = document.querySelector("#unity-canvas");
    var loadingBar = document.querySelector("#unity-loading-bar");
    var progressBarFull = document.querySelector("#unity-progress-bar-full");
    var fullscreenButton = document.querySelector("#unity-fullscreen-button");
    var warningBanner = document.querySelector("#unity-warning");

    // 一時的なメッセージバナー/リボンを数秒間表示するか、
    // type == 'error'の場合はキャンバスの上部に永続的なエラーメッセージを表示します。
    // type == 'warning'の場合、黄色のハイライト色が使用されます。
    // この関数を変更または削除して、重要ではない警告とエラーメッセージがユーザーに表示されるように
    // 視覚的に表示される方法をカスタマイズします。
    function unityShowBanner(msg, type) {
      function updateBannerVisibility() {
        warningBanner.style.display = warningBanner.children.length ? 'block' : 'none';
      }
      var div = document.createElement('div');
      div.innerHTML = msg;
      warningBanner.appendChild(div);
      if (type == 'error') div.style = 'background: red; padding: 10px;';
      else {
        if (type == 'warning') div.style = 'background: yellow; padding: 10px;';
        setTimeout(function() {
          warningBanner.removeChild(div);
          updateBannerVisibility();
        }, 5000);
      }
      updateBannerVisibility();
    }

    var buildUrl = "webgl-brotli/Build";
    var loaderUrl = buildUrl + "/WebGL_Brotli.loader.js";
    var config = {
      dataUrl: buildUrl + "/WebGL_Brotli.data.br",
      frameworkUrl: buildUrl + "/WebGL_Brotli.framework.js.br",
      codeUrl: buildUrl + "/WebGL_Brotli.wasm.br",
      streamingAssetsUrl: "StreamingAssets",
      companyName: "DefaultCompany",
      productName: "Platformer",
      productVersion: "2.1.0",
      showBanner: unityShowBanner,
    };

    // デフォルトでは、Unity は WebGL キャンバスレンダリングのターゲットサイズを
    // キャンバス要素の DOM サイズ（window.devicePixelRatio でスケーリング）と一致させます。
    // この同期がエンジン内で発生しないようにする場合は、これを false に設定し、
    // 代わりにサイズを大きくします。 キャンバスの DOM サイズと WebGL は、
    // ターゲットサイズを自分でレンダリングします。
    // config.matchWebGLToCanvasSize = false;

    if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
      container.className = "unity-mobile";
      // モバイルデバイスでフィルレートのパフォーマンスを低下させないようにし、
      // モバイルブラウザで低 DPI モードをデフォルト/オーバーライドします。
      config.devicePixelRatio = 1;
      unityShowBanner('WebGL builds are not supported on mobile devices.');
    } else {
      canvas.style.width = "960px";
      canvas.style.height = "600px";
    }
    loadingBar.style.display = "block";

    var script = document.createElement("script");
    script.src = loaderUrl;
    script.onload = () => {
      createUnityInstance(canvas, config, (progress) => {
        progressBarFull.style.width = 100 * progress + "%";
      }).then((unityInstance) => {
        loadingBar.style.display = "none";
        fullscreenButton.onclick = () => {
          unityInstance.SetFullscreen(1);
        };
      }).catch((message) => {
        alert(message);
      });
    };
    document.body.appendChild(script);
  </script>
}

Modificējiet, lai atļautu navigāciju uz Index.cshtml šo lapu.

<!-- 省略 -->

<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

<!-- 追加 -->
<ul>
  <li><a href="index.html">index.html</a></li>
  <li><a href="WebGL">WebGL</a></li>
  <li><a href="WebGLGzip">WebGLGzip</a></li>
  <li><a href="WebGLBrotli">WebGLBrotli</a></li>
</ul>

Fiksēšanas programma.cs

Ja modificējat to, kad tiek atbalstīts Gzip, varat izmantot to pašu kodu.

Pēc tā labošanas palaidiet atkļūdošanu un pārbaudiet, vai spēle darbojas.

Ja esat to pareizi iestatījis un spēle joprojām netiek rādīta, mēģiniet notīrīt tīmekļa pārlūkprogrammas kešatmiņu, lai notīrītu sīkfailus.

Izpratne par simptomiem, kas saistīti ar piekļuvi Brotli failiem IIS tīmekļa serverī

IIS pēc noklusējuma neatbalsta Brotli, tāpēc ir nepieciešama konfigurācija IIS pusē. Šķiet, ka to var apstrādāt, veicot papildu iestatījumus, bet es to nepaskaidrošu šajā padomā. Lūdzu, skatiet tālāk norādīto informāciju.

kļūdas ziņojums

Unable to load file webgl-brotli/Build/WebGL_Brotli.framework.js.br! Check that the file exists on the remote server. (also check browser Console and Devtools Network tab to debug)

Tīmekļa optimizētas (WebGL) spēles izvade

Spēles izšķirtspējas maiņa