IronPDF ハウツー ベースURL & アセットエンコーディング ベース URL の使用方法と C# .NET でのアセット エンコード 10 カーティス・チャウ 更新日:1月 10, 2026 IronPDF をダウンロード NuGet ダウンロード DLL ダウンロード Windows 版 無料トライアル LLM向けのコピー LLM向けのコピー LLM 用の Markdown としてページをコピーする ChatGPTで開く このページについてChatGPTに質問する ジェミニで開く このページについてGeminiに問い合わせる Grokで開く このページについてGrokに質問する 困惑の中で開く このページについてPerplexityに問い合わせる 共有する Facebook で共有 Xでシェア（Twitter） LinkedIn で共有 URLをコピー 記事をメールで送る This article was translated from English: Does it need improvement? Translated View the article in English IronPDFのベースURLは、BaseUrlOrPathパラメータを指定することで、HTMLからPDFへの変換時にCSS、JavaScript、イメージアセットが適切にロードされるようにします。 クイックスタート: IronPDFでのベースURLの実装 .NET C#でHTMLからPDFへの変換中にシームレスにアセットをロードするためのベースURLを実装することで、IronPDFを使い始めることができます。 この例では、BaseUrlOrPathを設定して、すべてのCSS、JavaScript、画像が適切に参照されるようにし、最小限の設定でPDF生成を簡素化する方法を示します。 今すぐ NuGet で PDF を作成してみましょう: NuGet パッケージ マネージャーを使用して IronPDF をインストールします PM > Install-Package IronPdf このコード スニペットをコピーして実行します。 new IronPdf.ChromePdfRenderer().RenderHtmlAsPdf("<img src='icons/logo.png'>", @"C:\site\assets\").SaveAs("with-assets.pdf"); 実際の環境でテストするためにデプロイする 今すぐ無料トライアルでプロジェクトに IronPDF を使い始めましょう 30日間無料トライアル 最小限のワークフロー（5ステップ） HTMLからCSS、画像をサポートするIronPDFをダウンロードする。 HTMLの外部画像にBaseUrlOrPathパラメータを指定してください。 ウェブとPDF表示のために、MVCで正しいsrcを構成する。 カスタムヘッダーとカスタムフッターにBaseUrlプロパティを指定する 出力PDFをチェックする 画像と CSS アセットを含む HTML 文字列から PDF をレンダリングするには? . 。 。 HTML文字列をPDFに変換するとき、CSS、JavaScriptファイル、画像などのアセットには**BaseUrlOrPath**パラメータを設定します。 `BaseUrlOrPath`は、すべてのアセットが相対的にロードされるベースURLを指定します。 これは、リモート資産をロードするための"http"で始まるWeb URLまたはディスク上の資産にアクセスするためのローカルファイルパスであることができます。 `BaseUrlOrPath`を正しく設定することで、変換中にアセットが正しく読み込まれるようにします。 HTMLからPDFへの変換の詳細については、包括的な[HTML to PDFチュートリアル](https://ironpdf.com/tutorials/html-to-pdf/)をご覧ください。 ```csharp :path=/static-assets/pdf/content-code-examples/how-to/base-urls-baseurl.cs ``` 外部資産を含む複雑なシナリオについては、[フォントの管理](https://ironpdf.com/how-to/manage-fonts/)や[PDFへの画像の追加](https://ironpdf.com/how-to/add-images-to-pdfs/)に関するガイドをご覧ください。 ### MVCアプリケーションでベースURLを設定するには? MVCアプリケーションでは、画像ファイルのパスを指定するには慎重な設定が必要です。 To ensure IronPDF finds images and displays them correctly on the website, configure the baseUrl and HTML src="" attribute properly. 以下のファイル階層を設定 - `baseUrlOrPath`を@"wwwroot/image "に変更する。 - `src`属性を"../image/Sample.jpg "に変更してください。 ```txt wwwroot └── image ├── Sample.jpg └── Sample.png ``` **例えば:** ```csharp :path=/static-assets/pdf/content-code-examples/how-to/base-mvc.cs ``` ```html ASP.NET Core MVC固有の実装については、[CSHTML to PDF (MVC Core)ガイド](https://ironpdf.com/how-to/cshtml-to-pdf-mvc-core/)を参照してください。 ### どのファイルパス形式を避けるべきですか? ブラケット-w-OPEN--@@@。 #### 機能しないファイルパス形式 これらのフォーマットはChromeブラウザでは動作しますが、MVCアプリでは間違ったディレクトリを指します。もし`baseUrlOrPath`が`RenderHtmlAsPdf`メソッドで提供されるなら、これらはIronPDFで動作します： ```html <img src="image/footer.png"/> <img src="./image/footer.png"/> これらのフォーマットはMVCアプリでは機能しますが、IronPDFファイルパスでは失敗します： <img src="/image/footer.png"/> <img src="~/image/footer.png"/> <img src="/image/footer.png"/> <img src="~/image/footer.png"/> HTML ブラケットを閉じる アセット ローディングの一般的なトラブルシューティングのヒントとは アセットが読み込めない場合は、以下のトラブルシューティング手順を検討してください： 1.絶対パスを検証する：アクセシビリティを確認するために、開発中に絶対ファイルパスを使用してください。 2.ファイルパーミッションのチェック: アプリケーションがアセットディレクトリへの読み取りアクセス権を持っていることを確認する。 3.リモートURLでテストする：パスの問題を分離するために完全修飾URLを使う 4.ロギングを有効にする：資産の読み込みをデバッグするためにIronPdfのカスタムロギングを使用してください。 // Example: Debug asset loading with absolute paths ChromePdfRenderer renderer = new ChromePdfRenderer(); // Enable debug logging renderer.RenderingOptions.EnableJavaScript = true; renderer.RenderingOptions.WaitFor.RenderDelay(500); // Give assets time to load // Use absolute path for testing string absoluteBasePath = Path.GetFullPath(@"C:\MyProject\wwwroot\assets"); string html = @" <html> <head> <link rel='stylesheet' href='styles/main.css'> </head> <body> <img src='images/logo.png' /> <script src='scripts/app.js'></script> </body> </html>"; PdfDocument pdf = renderer.RenderHtmlAsPdf(html, absoluteBasePath); // Example: Debug asset loading with absolute paths ChromePdfRenderer renderer = new ChromePdfRenderer(); // Enable debug logging renderer.RenderingOptions.EnableJavaScript = true; renderer.RenderingOptions.WaitFor.RenderDelay(500); // Give assets time to load // Use absolute path for testing string absoluteBasePath = Path.GetFullPath(@"C:\MyProject\wwwroot\assets"); string html = @" <html> <head> <link rel='stylesheet' href='styles/main.css'> </head> <body> <img src='images/logo.png' /> <script src='scripts/app.js'></script> </body> </html>"; PdfDocument pdf = renderer.RenderHtmlAsPdf(html, absoluteBasePath); IRON VB CONVERTER ERROR developers@ironsoftware.com $vbLabelText $csharpLabel 画像付きの HTML ヘッダーとフッターを追加するにはどうすればよいですか? . 。 。 新規または既存のPDFにHTMLヘッダーとフッターをレンダリングするとき、それらは独立したHTMLドキュメントとして扱われ、PDFからBaseURLを継承しません。 包括的なヘッダーとフッターのオプションについては、[ヘッダーとフッターのガイド](https://ironpdf.com/how-to/headers-and-footers/)をご覧ください。 アセットをロードするBaseURLを設定します： ```csharp :path=/static-assets/pdf/content-code-examples/how-to/base-header-footer.cs ``` ### なぜヘッダーはメインドキュメントのベース URL を継承しないのですか ヘッダーとフッターは、パフォーマンスと分離のために別々のHTMLドキュメントとしてレンダリングされます。 このデザインにより - メインコンテンツに影響を与えない独立したスタイリング - すべてのページで一貫したレンダリング - 大規模ドキュメントのメモリ管理を改善 - 異なるアセットソースを使用する柔軟性 ### ヘッダーとコンテンツで異なるベース URL を設定するにはどうすればよいですか? アセットを効果的に整理するために、ヘッダー、フッター、メインコンテンツに異なるベースURLを指定します： ```csharp ChromePdfRenderer renderer = new ChromePdfRenderer(); // Main content base URL string contentBaseUrl = @"C:\website\public\"; // Header specific assets renderer.RenderingOptions.HtmlHeader = new HtmlHeaderFooter() { HtmlFragment = "", BaseUrl = new Uri(@"C:\website\headers\").AbsoluteUri }; // Footer specific assets renderer.RenderingOptions.HtmlFooter = new HtmlHeaderFooter() { HtmlFragment = "", BaseUrl = new Uri(@"C:\website\footers\").AbsoluteUri }; // Render main content with its own base URL PdfDocument pdf = renderer.RenderHtmlAsPdf("", contentBaseUrl); ``` ## ローカル アセットを使用して HTML ファイルを PDF に変換するにはどうすればよいですか? . 。 。 HTMLファイルをPDFにレンダリングする場合、すべてのアセットはそのファイルにローカルであると仮定されます。HTMLファイルの変換については、[HTML File to PDFガイド](https://ironpdf.com/how-to/html-file-to-pdf/)をご覧ください。 ```csharp :path=/static-assets/pdf/content-code-examples/how-to/base-html-file.cs ``` 上記の例では、JS、CSS、画像ファイルはすべて、ディスク上のC:˶Assetsフォルダ（HTMLファイルと同じディレクトリ）から読み込まれます。 For convenience, use CustomCssUrl in ChromePdfRenderOptions for Additional Stylesheets to specify an additional stylesheet used only for .NET PDF rendering if desired. 例えば： ```csharp :path=/static-assets/pdf/content-code-examples/how-to/base-html-file-baseurl.cs ``` `ChromePdfRenderOptions.CustomCssUrl`プロパティは、現在、`RenderHtmlAsPdf`メソッドを使用してHTML文字列からPDFにレンダリングするときにのみ機能します。 ### 追加のスタイリングに CustomCssUrl を使用するのはいつですか? CustomCssUrlは次のような方に最適です： - **印刷物固有のスタイル**: ナビゲーションメニューやインタラクティブ要素を隠す - **PDFレイアウトの最適化**：印刷用に余白と改ページを調整する - **条件付き書式**：PDF生成時にのみスタイルを適用する - **A/Bテスト**：ソースHTMLを変更することなく、さまざまなPDFレイアウトをテストする。 ### HTMLファイルで相対アセット パスを処理するにはどうすればよいですか? 相対パスを含むHTMLファイルを扱う場合は、ファイル構造が参照をサポートしていることを確認してください： ```csharp // Example HTML file structure /* C:\Projects\Reports\ ├── invoice.html ├── css\ │ └── styles.css ├── js\ │ └── calculations.js └── images\ └── logo.png */ // HTML content with relative paths string htmlContent = @" "; // Save HTML and render File.WriteAllText(@"C:\Projects\Reports\invoice.html", htmlContent); ChromePdfRenderer renderer = new ChromePdfRenderer(); PdfDocument pdf = renderer.RenderHtmlFileAsPdf(@"C:\Projects\Reports\invoice.html"); pdf.SaveAs("invoice-output.pdf"); ``` ## HTMLでBase64を使って画像を直接エンコードするには? 画像アセットは、HTMLファイルまたは文字列に直接エンコードすることができ、画像の欠落による問題を避けることができます。 このアプローチでは、base64エンコーディングを使用してください。 さまざまな画像フォーマットについては、[画像ガイド](https://ironpdf.com/how-to/add-images-to-pdfs/)を参照してください。 1.まず、ファイルを読み込むか、ネットワークリクエストで受信して、画像のバイナリデータを取得します。 2.バイナリデータをbase64に変換するには、Microsoft .NETの`Convert.ToBase64String`メソッドを使用します。 3. base64データの前に "data:image/svg+xml;base64," を使用し、HTML内で画像タグを構築します。 画像タイプはbase64データの前に指定されることに注意してください。 [MDN Web Docsの画像タイプとフォーマット](https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types)を訪れて、画像フォーマットタイプについての詳細を得ることができます。 ```csharp :path=/static-assets/pdf/content-code-examples/how-to/add-images-to-pdfs-base64-image.cs ``` ### なぜファイル参照よりも Base64 エンコードを選ぶのでしょうか Base64エンコーディングにはいくつかの利点があります： - **自己完結型HTML**：外部依存がなく、配布が簡素化されます。 - **クロスプラットフォームの互換性**：ファイルシステムの違いに関係なく動作 - **セキュリティ**: ファイルシステムへのアクセスが不要なため、セキュリティリスクを軽減できます。 - **信頼性**：本番環境でのアセットエラーをなくします。 - **バージョン管理**：画像はHTMLの一部であり、バージョン管理を簡素化します。 ただし、以下のトレードオフを考慮してください： - **HTMLサイズの増加**: Base64エンコーディングはサイズを約33%増加させます。 - **キャッシュしない**: 埋め込まれた画像を個別にキャッシュすることはできません。 - **メモリ使用量**: 画像全体がメモリに読み込まれなければなりません。 ### どのような画像形式が Base64 エンコーディングに最適ですか? 画像フォーマットが異なると、base64エンコード時の効率も異なります： ```csharp // Example: Encoding different image formats public string EncodeImageWithMimeType(string imagePath) { byte[] imageBytes = File.ReadAllBytes(imagePath); string base64 = Convert.ToBase64String(imageBytes); // Determine MIME type based on extension string extension = Path.GetExtension(imagePath).ToLower(); string mimeType = extension switch { ".png" => "image/png", // Best for graphics with transparency ".jpg" or ".jpeg" => "image/jpeg", // Best for photographs ".gif" => "image/gif", // Best for simple animations ".svg" => "image/svg+xml", // Best for scalable graphics ".webp" => "image/webp", // Best overall compression _ => "image/png" // Default fallback }; return $"data:{mimeType};base64,{base64}"; } // Usage string encodedImage = EncodeImageWithMimeType("logo.png"); string html = $""; ``` ### Base64エンコーディングはPDFファイルのサイズにどのように影響しますか? Base64エンコーディングは、予測可能な方法でPDFサイズに影響を与えます： ```csharp // Comparison example public void CompareFileSizes() { ChromePdfRenderer renderer = new ChromePdfRenderer(); // Method 1: External image reference string htmlExternal = ""; PdfDocument pdfExternal = renderer.RenderHtmlAsPdf(htmlExternal, @"C:\images\"); // Method 2: Base64 encoded image byte[] imageBytes = File.ReadAllBytes(@"C:\images\large-photo.jpg"); string base64Image = Convert.ToBase64String(imageBytes); string htmlBase64 = $""; PdfDocument pdfBase64 = renderer.RenderHtmlAsPdf(htmlBase64); // Compare sizes Console.WriteLine($"Original image: {imageBytes.Length / 1024} KB"); Console.WriteLine($"PDF with external image: {pdfExternal.BinaryData.Length / 1024} KB"); Console.WriteLine($"PDF with base64 image: {pdfBase64.BinaryData.Length / 1024} KB"); } ``` 最適な結果を得るために - 小さなアイコンやロゴ（50KB未満）にはbase64を使用してください。 - 大きな画像や写真には外部リファレンスを使用してください。 - エンコードの前に圧縮を考慮する - コンテンツの種類に適した画像形式を使用する 高度なPDF最適化テクニックについては、[PDF圧縮ガイド](https://ironpdf.com/how-to/pdf-compression/)をご覧ください。 よくある質問 HTMLをPDFに変換する際、CSSやJavaScriptのアセットが正しく読み込まれるようにするにはどうすればよいですか？ IronPDFではHTMLからPDFへの変換時にBaseUrlOrPathパラメータを指定することができます。このパラメータはウェブURLまたはローカルファイルパスで、HTML内のすべての相対アセットパスのベースリファレンスとなり、CSS、JavaScript、画像が適切に読み込まれるようにします。 BaseUrlOrPathパラメータは何に使うのですか？ IronPDFのBaseUrlOrPathパラメータは、HTMLからPDFへの変換時にすべてのアセット(CSS、JavaScript、画像)が相対的に読み込まれるベースURLを指定します。リモートアセットには'http'で始まるウェブURL、ディスクベースのアセットにはローカルファイルパスを設定できます。 たった1行のコードでアセットを含むPDFをレンダリングするには？ IronPDFのChromePdfRendererを使って1行でHTMLをアセットと一緒にレンダリングすることができます: `new IronPdf.ChromePdfRenderer().RenderHtmlAsPdf("", @"C:∕Assets").SaveAs("with-assets.pdf");`.これは、すべてのアセットが適切に読み込まれるように BaseUrlOrPath を設定します。 PDF生成のためにMVCアプリケーションで画像パスを構成するにはどうすればよいですか？ IronPdfを使用するMVCアプリケーションでは、baseUrlOrPathをwwwrootサブディレクトリに設定し(例: @"wwwroot/image")、相対パスでHTMLのsrc属性を設定します(例: "../image/Sample.jpg")。こうすることで、画像がウェブサイト上でも生成されたPDF内でも正しく表示されるようになります。 HTMLをPDFに変換する際、ローカルとリモートの両方のアセットを使用できますか？ はい、IronPdfはローカルとリモートの両方のアセットをサポートしています。リモートアセットについては、BaseUrlOrPathを'http'で始まるウェブURLに設定してください。ローカルアセットにはディスク上のファイルパスを使用してください。この柔軟性により、PDF生成時にさまざまなソースからアセットを参照することができます。 BaseUrlOrPathパラメータを設定しないとどうなりますか？ IronPDFでBaseUrlOrPathパラメータを設定しないと、HTMLの相対アセットパスが正しく解決されず、生成されるPDFのCSSスタイル、JavaScript機能、画像が欠落します。HTMLに相対アセット参照が含まれている場合は、必ずこのパラメータを指定してください。 カーティス・チャウ 今すぐエンジニアリングチームとチャット テクニカルライター Curtis Chauは、カールトン大学でコンピュータサイエンスの学士号を取得し、Node.js、TypeScript、JavaScript、およびReactに精通したフロントエンド開発を専門としています。直感的で美しいユーザーインターフェースを作成することに情熱を持ち、Curtisは現代のフレームワークを用いた開発や、構造の良い視覚的に魅力的なマニュアルの作成を楽しんでいます。開発以外にも、CurtisはIoT（Internet of Things）への強い関心を持ち、ハードウェアとソフトウェアの統合方法を模索しています。余暇には、ゲームをしたりDiscordボットを作成したりして、技術に対する愛情と創造性を組み合わせています。 準備はできましたか？ Nuget ダウンロード 16,685,821 | バージョン: 2025.12 リリース NuGet 無料版 総ダウンロード数: 16,685,821 ライセンスを見る