質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.46%
Google ドライブ

Google ドライブは、Google社が提供するオンラインストレージサービス。オンラインストレージ上に、画像や動画、テキスト、Word/PDFのファイルなどさまざまなファイル保存することができます。また、他のユーザーと共有することも可能です。

Google Apps Script

Google Apps ScriptはGoogleの製品と第三者のサービスでタスクを自動化するためのJavaScriptのクラウドのスクリプト言語です。

Google

Googleは、アメリカ合衆国に位置する、インターネット関連のサービスや製品を提供している企業です。検索エンジンからアプリケーションの提供まで、多岐にわたるサービスを提供しています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

API

APIはApplication Programming Interfaceの略です。APIはプログラムにリクエストされるサービスがどのように動作するかを、デベロッパーが定めたものです。

Q&A

解決済

1回答

888閲覧

ドライブ内のHtmlが記載されたテキストファイルを読み込み、 内部のHtmlに埋め込みたい。

beginnerGAS

総合スコア2

Google ドライブ

Google ドライブは、Google社が提供するオンラインストレージサービス。オンラインストレージ上に、画像や動画、テキスト、Word/PDFのファイルなどさまざまなファイル保存することができます。また、他のユーザーと共有することも可能です。

Google Apps Script

Google Apps ScriptはGoogleの製品と第三者のサービスでタスクを自動化するためのJavaScriptのクラウドのスクリプト言語です。

Google

Googleは、アメリカ合衆国に位置する、インターネット関連のサービスや製品を提供している企業です。検索エンジンからアプリケーションの提供まで、多岐にわたるサービスを提供しています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

API

APIはApplication Programming Interfaceの略です。APIはプログラムにリクエストされるサービスがどのように動作するかを、デベロッパーが定めたものです。

0グッド

1クリップ

投稿2021/11/29 08:55

編集2021/11/29 09:15

前提・実現したいこと

GASを利用し、ドライブ内のHtmlが記載されたテキストファイルを読み込み、 内部のHtmlに埋め込みたいです。
こちら方法ありましたら教えて頂けると幸いです。

表示したい内容としては、
darkorange色で「テスト表示」とデプロイした際に出るようにしたいです。
よろしくお願いします。

↓以下、自分の方で試してみた内容になります。

main.gas

function doGet() { var html = HtmlService.createTemplateFromFile("index"); html.content = GetHtmlText(); return html.evaluate().setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL); } function GetHtmlText() { const DOC_URL = '※「simpleHtml」のURL'; const doc = DocumentApp.openByUrl(DOC_URL); return doc.getBody().getText(); }

index.html

<!DOCTYPE html> <html> <head> <?!= HtmlService.createHtmlOutputFromFile('css').getContent(); ?> <base target="_top"> </head> <body> <?=content?> </body> </html>

css.html

<style> .text { color: darkorange; } </style>

simpleHtml(ドライブ内のGoogleドキュメント)

<h1 class = "text">テスト表示</h1>

試したこと

現状の内容だと「<h1 class = "text">テスト表示</h1>」と表示されてしまいます。

補足情報(FW/ツールのバージョンなど)

ここにより詳細な情報を記載してください。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

<?= ~ ?> は中身(~)がエスケープされます。
(たとえばhtmlタグが含まれた変数を指定した場合、エスケープされた文字列が表示されます。
したがって質問文のような表示になります)

エスケープされないようにするには
<?!= ~ ?>
を使用します。(Force Printing Scriptlets

index.html

diff

1<!DOCTYPE html> 2<html> 3 <head> 4 <?!= HtmlService.createHtmlOutputFromFile('css').getContent(); ?> 5 <base target="_top"> 6 </head> 7 <body> 8- <?=content?> 9+ <?!=content?> 10 </body> 11</html>

※セキュリティ上、<?!= ?>は、今回のようにあらかじめ内容が限定された値を使うべきです。ユーザー入力値等に使用するとコードインジェクションの危険があります。

投稿2021/11/29 12:17

編集2021/11/29 12:18
退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

beginnerGAS

2021/11/30 04:25

ありがとうございます! 解決できました!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問