Version: 2023.2
언어: 한국어
웹에서 동영상 재생
웹의 내장된 리소스

웹에서의 텍스처 압축

웹 플랫폼에서 텍스처 압축을 사용하면 지원되는 텍스처 압축 포맷을 기반으로 플랫폼을 타게팅하는 빌드를 생성할 수 있습니다.

텍스처 압축 포맷

데스크톱과 모바일 디바이스는 서로 다른 텍스처 압축 포맷을 지원합니다. 웹 애플리케이션이 두 가지 타입 모두의 브라우저에서 압축 텍스처를 사용하게 하려면 먼저 지원되는 텍스처 압축 포맷을 선택해야 합니다.

압축 텍스처를 사용하여 데스크톱과 모바일 브라우저 모두에서 게임을 실행하려면 다음을 타게팅하는 두 가지 빌드를 생성할 수 있습니다.

  • 텍스처 압축 포맷이 DXT로 설정된 데스크톱 브라우저.
  • 텍스처 압축 포맷이 ASTC(적응형 스케일러블 텍스처 압축)로 설정된 모바일 브라우저.

압축 포맷 설정에 대한 우선 순위

웹 애플리케이션의 기본 텍스처 압축 포맷은 웹 Build Settings 창 또는 웹 Player Settings 창에서 설정할 수 있습니다. 텍스처 압축 포맷을 설정하기 전에 설정 중에서 우선순위를 정해야 합니다. Build Settings에서 설정한 텍스처 압축 포맷 값은 Player Settings에서 설정한 값보다 우선합니다. 기본적으로 Unity 에디터는 Build Settings 값을 Use Player Settings로 설정합니다.

에디터는 Build Settings의 텍스처 압축을 Library 폴더에 직렬화합니다. 따라서 이는 버전 관리를 통해 관리되지 않습니다.

개별 텍스터에 대해 텍스처 압축 포맷을 커스터마이즈할 수도 있습니다. 개별 텍스처에 설정한 값이 기본 텍스처 압축 형식 값을 오버라이드합니다. 개별 텍스처의 텍스처 포맷을 변경하는 방법에 대한 자세한 내용은 텍스처 임포트 설정을 참조하십시오.

기본 압축 포맷 설정

Build Settings 또는 Player Settings를 사용하는 웹 애플리케이션의 기본 텍스처 압축 포맷을 설정할 수 있습니다. Build Settings에서 설정한 텍스처 압축 포맷 값은 Player Settings에서 설정한 값보다 우선합니다. 기본적으로 Unity 에디터는 Build Settings 값을 Use Player Settings로 설정합니다.

Build Settings를 사용하여 기본 텍스처 압축 포맷을 선택하려면 다음을 수행합니다.

  1. File > Build Settings를 선택합니다.
  2. Platform 창의 플랫폼 목록에서 Web을 선택합니다.
  3. Texture Compression 드롭다운 메뉴에서 압축 포맷을 선택합니다.

Player Settings를 사용하여 기본 텍스처 압축 포맷을 선택하려면 다음을 수행합니다.

  1. File > Build Settings를 선택합니다.
  2. Platform 창의 플랫폼 목록에서 Web을 선택합니다.
  3. Player Settings > Other Settings를 선택합니다.
  4. Texture compression format 드롭다운 메뉴에서 압축 포맷을 선택합니다.

해당 텍스처 압축 포맷으로 데스크톱 브라우저와 모바일 브라우저용 빌드를 동시에 생성하는 방법에 대한 예시는 스크립트에서 데스크톱 및 모바일 브라우저용 빌드 생성을 참조하십시오.

스크립트에서 데스크톱 및 모바일 브라우저용 빌드 생성

스크립트를 사용하여 해당 텍스처 압축 포맷으로 동시에 데스크톱 브라우저 및 모바일 브라우저용 빌드를 실행할 수 있습니다.예시:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEditor;
using System.Diagnostics;
using System.IO;
using UnityEditor.Build.Reporting;

public class comboBuild
{
    //This creates a menu item to trigger the dual builds https://docs.unity3d.com/ScriptReference/MenuItem.html 

    [MenuItem("Game Build Menu/Dual Build")]
    public static void BuildGame()
    {
      //This builds the player twice: a build with desktop-specific texture settings (WebGL_Build) as well as mobile-specific texture settings (WebGL_Mobile), and combines the necessary files into one directory (WebGL_Build)
      
      string dualBuildPath    = "WebGLBuilds";
      string desktopBuildName = "WebGL_Build";
      string mobileBuildName  = "WebGL_Mobile";

      string desktopPath = Path.Combine(dualBuildPath, desktopBuildName);
      string mobilePath  = Path.Combine(dualBuildPath, mobileBuildName);
      string[] scenes = new string[] {"Assets/scene.unity"};

      EditorUserBuildSettings.webGLBuildSubtarget = WebGLTextureSubtarget.DXT;
      BuildPipeline.BuildPlayer(scenes, desktopPath, BuildTarget.WebGL, BuildOptions.Development); 

      EditorUserBuildSettings.webGLBuildSubtarget = WebGLTextureSubtarget.ASTC;
      BuildPipeline.BuildPlayer(scenes,  mobilePath, BuildTarget.WebGL, BuildOptions.Development); 

      // Copy the mobile.data file to the desktop build directory to consolidate them both
      FileUtil.CopyFileOrDirectory(Path.Combine(mobilePath, "Build", mobileBuildName + ".data"), Path.Combine(desktopPath, "Build", mobileBuildName + ".data"));
    }  
}

텍스처 압축 포맷 확장자가 지원되는 경우 웹 템플릿index.html 파일을 수정하여 적절한 데이터 파일을 선택할 수 있습니다.

// ASTC 텍스처 압축 포맷의 지원 여부에 따라 데이터 파일을 선택합니다.
      var dataFile = "/{{{ DATA_FILENAME }}}";                                  
      var c = document.createElement("canvas");                                 
      var gl = c.getContext("webgl");                                      
      var gl2 = c.getContext("webgl2");                                    
      if ((gl && gl.getExtension('WEBGL_compressed_texture_astc')) || (gl2 &&   
              gl2.getExtension('WEBGL_compressed_texture_astc'))) {             
        dataFile =  "/WebGL_Mobile.data";                                       
      }                                                                         

      var buildUrl = "Build";
      var loaderUrl = buildUrl + "/{{{ LOADER_FILENAME }}}";                    
      var config = {                                                            
        dataUrl: buildUrl + dataFile,                                           
        frameworkUrl: buildUrl + "/{{{ FRAMEWORK_FILENAME }}}",                 
# if USE_WASM                                                                    
        codeUrl: buildUrl + "/{{{ CODE_FILENAME }}}",                           
# endif                                                                          
# if MEMORY_FILENAME                                                             
        memoryUrl: buildUrl + "/{{{ MEMORY_FILENAME }}}",                       
# endif
# if SYMBOLS_FILENAME                                                            
        symbolsUrl: buildUrl + "/{{{ SYMBOLS_FILENAME }}}",                     
# endif                                                                          
        streamingAssetsUrl: "StreamingAssets",                                
        companyName: {{{ JSON.stringify(COMPANY_NAME) }}},
        productName: {{{ JSON.stringify(PRODUCT_NAME) }}},
      productVersion: {{{ JSON.stringify(PRODUCT_VERSION) }}},                
        showBanner: unityShowBanner,                                            
     };

추가 리소스

웹에서 동영상 재생
웹의 내장된 리소스