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

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

新規登録して質問してみよう
ただいま回答率
85.48%
CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

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

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

6回答

18750閲覧

html5での別サイトの埋め込み

BSNagamon

総合スコア8

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

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

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

1クリップ

投稿2016/03/02 05:01

編集2016/03/02 07:46

こんにちは.僕は国立大学の情報工学科に通う大学2年生です.

現在,所属するサークルのホームページを市販されているホームページビルダーなどを使わずに作成しているのですが,そこで詰まった箇所が出てしまったので質問させていただきました.

サークルのホームページの中に別のサイトのページを埋め込みたい(下の写真の状況です)のですが,

  1. iframe要素やobject要素を用いないで実装する方法はありますでしょうか?もしあるのであればお教え願います.

  2. もし別サイトの埋め込みがiframe要素やobject要素を用いるしか方法がないとして,ネットの記事で見た「iframe要素の脆弱性」を回避する方法がありましたらこちらもお教え願います.

質問は以上の2つです.お手数ですが何卒よろしくお願い致します.

イメージ説明

情報追加のご指摘があったので追記しておきます.
上述の「ifame要素の脆弱性」は こちら のことになります.

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

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

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

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

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

ogaaaan

2016/03/02 05:39

ネットの記事で見た「iframe要素の脆弱性」にはリンクを張ってください。
ogaaaan

2016/03/02 07:49

あざっす!
guest

回答6

0

iframe要素のバッファーオーバーフロー脆弱性 (IE6限定)

上記サイトには脆弱性に関する詳細が載っていないようですが、2004年に報告されたバッファオーバーフローの脆弱性とは下記記事の事でしょうか。
当時、MSはパッチを出しましたし、当該OSのサポートは終了しているので考慮する必要はないように思われます。

iframe 要素の sandbox 属性 (HTML5)

HTML5 から iframe 要素に sandbox 属性が追加され、iframe 文書からのアクセスコントロールが出来るようになり、比較的安全にiframe文書を読み込めるようになりました。

Web スクレイピング

公開サイトで余所サイトをWebスクレイピングする行為は基本的にNGです。
自サイト内でテンプレート文書を読み込む実装ならサーバサイドスクリプトで非公開ディレクトリからHTMLを読み込む方法がお勧めです。
JavaScript でも実装可能ですが、HTTPリクエストのコストが重いのとJavaScript無効環境で動作しない欠点があります。

Re: BSNagamon さん

投稿2016/03/02 08:43

think49

総合スコア18162

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

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

BSNagamon

2016/03/02 09:58

回答ありがとうございます! よく調べてみたら10年ほど前の記事でした...まだまだ勉強が足りませんでした. いろいろな方法があることを踏まえて,さらに知見を増やしていこうと思います 回答ありがとうございました!
guest

0

学生なのにセキュリティ対策を考えとるとは偉い

iframeかobjectしかないっすね

クリックジャッキング対策が必要、今作ってるページを誰かが他のサイトでiframeから呼び出して悪さするやつ。
webサーバの.htaccessファイルに、以下の内容を追加すればok

・iframe表示を同一ドメイン内のみ許可、それ以外は禁止する場合
<ifmodule mod_headers.c>
Header always append X-Frame-Options SAMEORIGIN
</ifmodule>

・iframe表示を指定されたドメインのみ許可する場合
<ifmodule mod_headers.c>
Header always append X-Frame-Options ALLOW-FROM http://www.example.jp/
</ifmodule>

エラーになるときは"always"消してリトライしてみてくださーい

投稿2016/03/02 07:45

takaki.ishibash

総合スコア120

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

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

BSNagamon

2016/03/02 08:11

回答ありがとうございます! iframeかobject要素を使うしかないのですね... .htaccessを初めて聞きました.このようなセキュリティ対策の仕方もあるのですね,これを機にサーバ関係の勉強も始めようと思います. 丁寧なご回答ありがとうございました!
guest

0

簡易的なサイトの製作という様にお見受けしての解答となりますが、

https://ghweb.info/post-3178.html
同一ドメイン内であればこの方法が使えます。
CSSなどは表示内ページで再定義する必要があるかと思いますのでご注意を。

外部ドメインであればXSSとなる為、懸念されている脆弱性の問題を回避するには様々な施策が必要となりますので、本件では説明は省きます。

投稿2016/03/02 05:31

lazyeyed

総合スコア48

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

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

BSNagamon

2016/03/02 08:07

早速の回答ありがとうございます! なるほど,同一のドメインであればJavaScriptで制御できるのですね. 勉強になりました,ありがとうございました!
guest

0

http://highfivecreate.com/blog/course/tips/817.html
htmlレベルで頑張るならjquery loadをクロスドメインでやるとかどうですか?
例えば取得したいものが更新情報だったりするなら、RSSがあれば、jqueryだけでも普通にもってこれますよね。

PHPではこんな感じですかね。
http://php.net/manual/ja/function.file-get-contents.php
http://php.net/manual/ja/curl.examples-basic.php

基本的に他サイトから情報をもってくる事自体、自分で制御できない不確定なものになるので、
セキュリティ的に言えばiframeだろうがノーガードじゃないかなと思います。

もちろん読み込んだコンテンツ内に悪意があるコードがあれば、ですけどね。

投稿2016/04/24 18:58

cdy

総合スコア10

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

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

0

YOUTUBEで撮影してembedとか?

HTMLのversion変えてframeset利用するとか?

IS怖いですもんね。

投稿2016/04/24 18:15

KatsukiSugiura

総合スコア335

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

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

guest

0

メインコンテンツに埋め込みたい別のサイトって、
まったく管理できない場所にあるコンテンツなんでしょうか?
多くのサイトで使われているバナー広告などは、基本的にiframeを使っているものが多いですよ。

もし埋め込みたいコンテンツが自分たちの管理下であるなら問題なくiframe使えばいいと思います。
ぜんぜん関係ない人が作った独立したコンテンツなら、そもそも埋め込みすることを許可してもらっておくのがよいです。

それから最後に、もし『サークル名など』『サブコンテンツ』を全ページ分用意しないために、メインのコンテンツを埋め込むことを思いついたのなら、別の方法をとったほうがよいです。

投稿2016/03/02 07:55

ogaaaan

総合スコア765

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

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

BSNagamon

2016/03/02 08:19

情報追加のご指摘と質問への回答ありがとうございます! サークルのホームページはさくらインターネットさんのレンタルサーバ(スタンダード)をお借りして作成しているもの,埋め込みたいサイトは さくらのブログ です. 同じさくらインターネットさんの提供なのですが,前者が『http://www.example.sakura.ne.jp/』,後者が『http://example.blog.shinobi.jp/』でドメインが違うのです,こういった場合も自分たちの管理下にあるということでよろしいのでしょうか?
ogaaaan

2016/03/02 08:43

なるほどあざっすー。 で、さくらのサイトじゃ管理下じゃないですね。 ”自分たちがいじれないものは管理下じゃない”って感じッス。 で、さくらのサイトなら埋め込んじゃっても別に大丈夫なんじゃないですかね。 悪意のあるサイトではないし、そもそもさくらくらいの規模の企業なら、 もとよりセキュリティには万全の体制とってるはずだし。 なんなら、さくらのサポートに、iframeで中身を表示したいって聞いてみるのもよいかもしれないすね。
BSNagamon

2016/03/02 09:33

そうですね,一度さくらさんに問い合わせてみようと思います. 色々とありがとうございました!!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問