跳到內容

Edge Runtime

Next.js 有兩個可在應用程式中使用的伺服器執行時

  • Node.js 執行時(預設),可訪問所有 Node.js API,用於渲染應用程式。
  • Edge 執行時包含一組更有限的API,用於代理

注意事項

  • Edge 執行時不支援所有 Node.js API。某些軟體包可能無法按預期工作。
  • Edge 執行時不支援增量靜態再生 (ISR)。
  • 這兩個執行時都可以支援流式傳輸,具體取決於您的部署介面卡。

參考

Edge 執行時支援以下 API

網路 API

API描述
Blob表示一個 Blob 物件
fetch獲取資源
FetchEvent表示一個獲取事件
File表示一個檔案
FormData表示表單資料
Headers表示 HTTP 頭部
Request表示一個 HTTP 請求
Response表示一個 HTTP 響應
URLSearchParams表示 URL 搜尋引數
WebSocket表示一個 WebSocket 連線

編碼 API

API描述
atob解碼 base-64 編碼的字串
btoa將字串編碼為 base-64 格式
TextDecoder將 Uint8Array 解碼為字串
TextDecoderStream可用於流的鏈式解碼器
TextEncoder將字串編碼為 Uint8Array
TextEncoderStream可用於流的鏈式編碼器

流 API

API描述
ReadableStream表示一個可讀流
ReadableStreamBYOBReader表示 ReadableStream 的讀取器
ReadableStreamDefaultReader表示 ReadableStream 的讀取器
TransformStream表示一個轉換流
WritableStream表示一個可寫流
WritableStreamDefaultWriter表示 WritableStream 的寫入器

加密 API

API描述
crypto提供對平臺加密功能的訪問
CryptoKey表示一個加密金鑰
SubtleCrypto提供對常見加密原語(如雜湊、簽名、加密或解密)的訪問

Web 標準 API

API描述
AbortController允許您根據需要中止一個或多個 DOM 請求
Array表示值的陣列
ArrayBuffer表示一個通用的、固定長度的原始二進位制資料緩衝區
Atomics以靜態方法形式提供原子操作
BigInt表示具有任意精度的整數
BigInt64Array表示一個 64 位帶符號整數的型別化陣列
BigUint64Array表示一個 64 位無符號整數的型別化陣列
Boolean表示邏輯實體,可具有兩個值:truefalse
clearInterval取消之前透過呼叫 setInterval() 建立的定時重複操作
clearTimeout取消之前透過呼叫 setTimeout() 建立的定時重複操作
console提供對瀏覽器除錯控制檯的訪問
DataView表示 ArrayBuffer 的通用檢視
Date以平臺無關的格式表示單個時間點
decodeURI解碼以前由 encodeURI 或類似例程建立的統一資源識別符號 (URI)
decodeURIComponent解碼以前由 encodeURIComponent 或類似例程建立的統一資源識別符號 (URI) 元件
DOMException表示在 DOM 中發生的錯誤
encodeURI透過將特定字元的每個例項替換為一個、兩個、三個或四個表示該字元 UTF-8 編碼的轉義序列來編碼統一資源識別符號 (URI)
encodeURIComponent透過將特定字元的每個例項替換為一個、兩個、三個或四個表示該字元 UTF-8 編碼的轉義序列來編碼統一資源識別符號 (URI) 元件
Error表示在嘗試執行語句或訪問屬性時發生的錯誤
EvalError表示與全域性函式 eval() 相關的錯誤
Float32Array表示 32 位浮點數的型別化陣列
Float64Array表示 64 位浮點數的型別化陣列
Function表示函式
Infinity表示數學上的無窮大值
Int8Array表示 8 位帶符號整數的型別化陣列
Int16Array表示 16 位帶符號整數的型別化陣列
Int32Array表示 32 位帶符號整數的型別化陣列
Intl提供對國際化和本地化功能的訪問
isFinite判斷值是否為有限數
isNaN判斷值是否為 NaN
JSON提供將 JavaScript 值轉換為 JSON 格式以及從 JSON 格式轉換的功能
Map表示值的集合,其中每個值只能出現一次
Math提供對數學函式和常量的訪問
Number表示數值
Object表示所有 JavaScript 物件的基物件
parseFloat解析字串引數並返回浮點數
parseInt解析字串引數並返回指定基數的整數
Promise表示非同步操作最終完成(或失敗)及其結果值
Proxy表示用於為基本操作(例如屬性查詢、賦值、列舉、函式呼叫等)定義自定義行為的物件
queueMicrotask將微任務排隊等待執行
RangeError表示當值不在允許值集合或範圍內時發生的錯誤
ReferenceError表示引用不存在的變數時發生的錯誤
Reflect提供可攔截的 JavaScript 操作方法
RegExp表示正則表示式,允許您匹配字元組合
Set表示值的集合,其中每個值只能出現一次
setInterval重複呼叫一個函式,每次呼叫之間有固定的時間延遲
setTimeout在指定毫秒數後呼叫函式或計算表示式
SharedArrayBuffer表示一個通用的、固定長度的原始二進位制資料緩衝區
String表示字元序列
structuredClone建立值的深層副本
Symbol表示用作物件屬性鍵的唯一且不可變的資料型別
SyntaxError表示嘗試解釋語法無效程式碼時發生的錯誤
TypeError表示當值不是預期型別時發生的錯誤
Uint8Array表示 8 位無符號整數的型別化陣列
Uint8ClampedArray表示 8 位無符號整數的型別化陣列,範圍限制在 0-255
Uint32Array表示 32 位無符號整數的型別化陣列
URIError表示全域性 URI 處理函式使用不當時的錯誤
URL表示提供用於建立物件 URL 的靜態方法的物件
URLPattern表示 URL 模式
URLSearchParams表示鍵/值對的集合
WeakMap表示鍵被弱引用的鍵/值對集合
WeakSet表示物件的集合,其中每個物件只能出現一次
WebAssembly提供對 WebAssembly 的訪問

Next.js 特定 Polyfill

環境變數

您可以使用 process.env 訪問 環境變數,適用於 next devnext build

不支援的 API

Edge 執行時有一些限制,包括

  • 原生 Node.js API 不支援。例如,您無法讀取或寫入檔案系統。
  • 可以使用 node_modules,只要它們實現 ES 模組且不使用原生 Node.js API。
  • 直接呼叫 require 不允許。請改用 ES 模組。

以下 JavaScript 語言特性已被停用,將無法工作:

API描述
eval評估以字串表示的 JavaScript 程式碼
new Function(evalString)使用作為引數提供的程式碼建立一個新函式
WebAssembly.compile從緩衝區源編譯 WebAssembly 模組
WebAssembly.instantiate從緩衝區源編譯和例項化 WebAssembly 模組

在極少數情況下,您的程式碼可能包含(或匯入)一些動態程式碼評估語句,這些語句無法在執行時到達,並且無法透過搖樹最佳化移除。您可以透過代理配置放寬檢查以允許特定檔案

proxy.ts
export const config = {
  unstable_allowDynamic: [
    // allows a single file
    '/lib/utilities.js',
    // use a glob to allow anything in the function-bind 3rd party module
    '**/node_modules/function-bind/**',
  ],
}

unstable_allowDynamic 是一個 glob,或 glob 陣列,它忽略特定檔案的動態程式碼評估。glob 相對於您的應用程式根資料夾。

請注意,如果這些語句在 Edge 上執行,它們將丟擲並導致執行時錯誤