0

Webページのさまざまな部分で作業する複数の開発者が開発を行うプロジェクトを管理しています。私たちは、副作用のためにウェブページの一部を組み合わせる際に、統合の問題に直面しています。Webページ内の部品を分離して、他の部品に影響を与えないようにするにはどうすればいいですか?

Webパーツにエラーがあるか、書き込みが不十分であるか、Webフィルタによってブロックされている場合、Webパーツの他の部分のレンダリングに影響します。

Webページをきれいに区切る方法はありますか?

私の研究は、この正確な問題のアプローチやフレームワークではなく、共有ポイントのWebパーツだけを指摘しています。 IFrame Isolationが関連していますが、その解決策は丸い穴に四角いペグを置くことに似ています。

+0

あなたは "バニラ"カスタム要素を作成し、iframeアイソレーションを使用して、任意のJSフレームワークでコンポーネントを作成することができます。 – Supersharp

+0

@Supersharp Thqしかし、私はウェブページの一部を分離する堅牢なソリューションを探しています。これらの部分は副作用があってはいけません。iframeを見ましたが、それは目的を果たさない、私はSOリンクを含むように私の質問を編集しました。 – Manu

+0

更新情報にiframeを使用できない理由がわかりません。とにかくカスタム要素のようなコンポーネントを使用しようとすることができます。https://developers.google.com/web/fundamentals/getting-started/primers/customelements – Supersharp

答えて

0

Webパーツにエラーがあるか、書き込みが不十分な場合、またはWebフィルタリングによってブロックされている場合は、Webページの他の部分のレンダリングに影響します。

利用のtry/catchブロック:

window.addEventListener("error", function(e){return false;}, true); 
 
try{angular.run();} 
 
catch(e){console.log(e.toString())}; 
 
$("body").append("<div>Hi</div>");
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

または遅延ロード:

void(function foo() 
 
    { 
 
    /* get head element */ 
 
    var head = document.getElementsByTagName("head")[0]; 
 

 
    /* create script element */ 
 
    var jQueryJS = document.createElement("script"); 
 

 

 
    /* define script src attribute to lazy load */ 
 
    jQueryJS.src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"; 
 

 
    /* append script */ 
 
    head.appendChild(jQueryJS); 
 

 

 
    /* call tests after jQuery loads */ 
 
    jQueryJS.onload = function() 
 
    { 
 
    $("body").append("<h1>Hi</h1>"); 
 
    } 
 
    }() 
 
);

のその他のアプローチが含ま:

  • HTML5サンドボックス/ CSP対応のセキュリティアーキテクチャ
  • ツリーハウス:ウェブ労働者のサンドボックスアーキテクチャ
  • JSand:仮想のiframe
  • :ECMAScriptの(SES)はサンドボックスアーキテクチャを-enabled
  • のAdSafeセキュア

参照

関連する問題