首頁 >web前端 >js教程 >允許 Next.js 中影像的所有域

允許 Next.js 中影像的所有域

Barbara Streisand
Barbara Streisand原創
2024-12-21 13:33:17216瀏覽

Next.js中,從外部域載入映像需要在next.config.js中進行設定。您可以透過使用帶有通配符的remotePatterns或透過未最佳化完全停用影像優化來允許來自所有網域的映像。

Allow All Domains for Images in Next.js


方法1:使用帶有通配符的remotePatterns

import type { NextConfig } from "next";

const nextConfig: NextConfig = {
  images: {
    remotePatterns: [
      {
        protocol: "https",
        hostname: "*", // Allow images from all domains
      },
    ],
  },
};

export default nextConfig;

方法2:使用未最佳化

import type { NextConfig } from "next";

const nextConfig: NextConfig = {
  images: {
    unoptimized: true, // Disable image optimization
  },
};

export default nextConfig;

何時使用:

  • remotePatterns:當您想要最佳化影像和靈活性時。
  • 未最佳化:當您需要來自任何網域且未經最佳化的影像時。

這種方法有助於處理動態影像來源並繞過域限制。 ?

讓我們聯絡吧?

  • 吉圖布
  • 中等的
  • 領英

以上是允許 Next.js 中影像的所有域的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn