開発メモ

【EC-CUBE】Chromeで、管理画面からYouTubeやGoogle Mapの埋め込みコードを登録する方法

Google Chromeでは管理画面からの登録時に、iframeタグが含まれている場合、
ERR_BLOCKED_BY_XSS_AUDITORというエラー画面が表示され、登録出来ない場合があります。
▼対策方法
商品登録画面から、確認画面へ遷移する前にjavascriptで、iframeタグの「src」を「[src]」に書き換え、
データを登録する直前に、書き換えた内容を復元することで、登録まで行うことが出来ます。
(1). /data/Smarty/templates/admin/products/product.tpl

・修正前
<li><a class=”btn-action” href=”javascript:;” onclick=”selectAll(‘category_id’); document.form1.submit(); return false;”><span class=”btn-next”>確認ページへ</span></a></li>
・修正後
<li><a class=”btn-action” href=”javascript:;” onclick=”selectAll(‘category_id’); escapeSrc(); document.form1.submit(); return false;”><span class=”btn-next”>確認ページへ</span></a></li>

・スクリプトを追加(nameが「youtube」のinput要素に、埋め込みコードを登録する場合)
<script type=”text/javascript”>
function escapeSrc() {
// iframeの記述がある場合
if ($(‘input[name=”youtube”]’).val().indexOf(‘iframe’) != -1) {
// 「src=」という記述を「[src]=」に変換
var escapedElem = $(‘input[name=”youtube”]’).val().replace(/src=/g, ‘[src]=’);
$(‘input[name=”youtube”]’).val(escapedElem);
}
}
</script>
(2). /data/Smarty/templates/admin/products/confirm.tpl

確認画面に、埋め込みコードを表示する場合は、以下の様にコードを復元します。

・スクリプトを追加(class名が「youtube」の要素内に、埋め込みコード表示している場合)
<script type=”text/javascript”>
$(function(){
// iframeの記述がある場合
if ($(‘.youtube’).html().indexOf(‘iframe’) != -1) {
// 「src=」という記述を「[src]=」に変換
var unescapedElem = $(‘.youtube’).html().replace(/\[src\]=/g, ‘src=’);
$(‘.youtube’).html(unescapedElem);
}
});
</script>
(3). /data/class/pages/admin/products/LC_Page_Admin_Products_Product.php

function lfRegistProduct() 内の、$objQuery->begin();の直前に以下を追加。

$sqlval[‘youtube’] = str_replace(‘[src]=’, ‘src=’, $arrList[‘youtube’]);

プライバシーマーク
Return Top