0

私が持っている主な目的は、python cgi スクリプトを使用して javascript 変数を mysql db に保存することです。これは、js 変数の内容です。

<li style="width: 300px; background-color: white; list-style-image: url(http://champ/images/plus.gif); ">Costco 
  <input style="float: right; display: none; " type="image" src="/images/next_level.png" alt="Submit button" onclick="newLevel(this)">
  <input style="float: right; margin-right: 7px; display: none; " type="image" src="/images/b_add.png" alt="Submit button" onclick="addItem(this)">
  <input style="float: right; margin-right: 7px; display: none; " type="image" src="/images/b_edit.png" alt="Submit button" onclick="editItem(this)">
  <input style="float: right; margin-right: 7px; display: none; " type="image" src="/images/b_drop.png" alt="Submit button" onclick="delItem(this)">
  <ul style="display: none; ">
    <li style="width: 300px; background-color: white; cursor: default; list-style-image: none; ">Cheese
        <input style="float:right;" type="image" src="/images/next_level.png" alt="Submit button" onclick="newLevel(this)">
        <input style="float:right; margin-right: 7px;" type="image" src="/images/b_add.png" alt="Submit button" onclick="addItem(this)">
        <input style="float:right; margin-right: 7px" type="image" src="/images/b_edit.png" alt="Submit button" onclick="editItem(this)">
        <input style="float:right; margin-right: 7px" type="image" src="/images/b_drop.png" alt="Submit button" onclick="delItem(this)">
    </li>
    <li style="width: 300px; background-color: white; cursor: default; list-style-image: none; ">Milk
        <input style="float:right;" type="image" src="/images/next_level.png" alt="Submit button" onclick="newLevel(this)">
        <input style="float:right; margin-right: 7px;" type="image" src="/images/b_add.png" alt="Submit button" onclick="addItem(this)">
        <input style="float:right; margin-right: 7px" type="image" src="/images/b_edit.png" alt="Submit button" onclick="editItem(this)">
        <input style="float:right; margin-right: 7px" type="image" src="/images/b_drop.png" alt="Submit button" onclick="delItem(this)">
    </li>
    <li style="width: 300px; cursor: default; list-style-image: none; ">Pretzels
        <input style="float:right;" type="image" src="/images/next_level.png" alt="Submit button" onclick="newLevel(this)">
        <input style="float:right; margin-right: 7px;" type="image" src="/images/b_add.png" alt="Submit button" onclick="addItem(this)">
        <input style="float:right; margin-right: 7px" type="image" src="/images/b_edit.png" alt="Submit button" onclick="editItem(this)">
        <input style="float:right; margin-right: 7px" type="image" src="/images/b_drop.png" alt="Submit button" onclick="delItem(this)">
    </li>
  </ul>
</li>
<li style="width: 300px; background-color: white; list-style-image: url(http://champ/images/plus.gif); ">Walmart
  <input style="float: right; display: none; " type="image" src="/images/next_level.png" alt="Submit button" onclick="newLevel(this)">
  <input style="float: right; margin-right: 7px; display: none; " type="image" src="/images/b_add.png" alt="Submit button" onclick="addItem(this)">
  <input style="float: right; margin-right: 7px; display: none; " type="image" src="/images/b_edit.png" alt="Submit button" onclick="editItem(this)">
  <input style="float: right; margin-right: 7px; display: none; " type="image" src="/images/b_drop.png" alt="Submit button" onclick="delItem(this)">
  <ul style="display: none; ">
    <li style="width: 300px; background-color: white; cursor: default; list-style-image: none; ">Bread 
      <input style="float:right;" type="image" src="/images/next_level.png" alt="Submit button" onclick="newLevel(this)">
      <input style="float:right; margin-right: 7px;" type="image" src="/images/b_add.png" alt="Submit button" onclick="addItem(this)">
      <input style="float:right; margin-right: 7px" type="image" src="/images/b_edit.png" alt="Submit button" onclick="editItem(this)">
      <input style="float:right; margin-right: 7px" type="image" src="/images/b_drop.png" alt="Submit button" onclick="delItem(this)">
    </li><li style="width: 300px; background-color: white; cursor: default; list-style-image: none; ">Bannanas 
      <input style="float:right;" type="image" src="/images/next_level.png" alt="Submit button" onclick="newLevel(this)">
      <input style="float:right; margin-right: 7px;" type="image" src="/images/b_add.png" alt="Submit button" onclick="addItem(this)">
      <input style="float:right; margin-right: 7px" type="image" src="/images/b_edit.png" alt="Submit button" onclick="editItem(this)">
      <input style="float:right; margin-right: 7px" type="image" src="/images/b_drop.png" alt="Submit button" onclick="delItem(this)">
    </li><li style="width: 300px; background-color: white; cursor: default; list-style-image: none; ">Cereal 
      <input style="float:right;" type="image" src="/images/next_level.png" alt="Submit button" onclick="newLevel(this)">
      <input style="float:right; margin-right: 7px;" type="image" src="/images/b_add.png" alt="Submit button" onclick="addItem(this)">
      <input style="float:right; margin-right: 7px" type="image" src="/images/b_edit.png" alt="Submit button" onclick="editItem(this)">
      <input style="float:right; margin-right: 7px" type="image" src="/images/b_drop.png" alt="Submit button" onclick="delItem(this)">
    </li><li style="width: 300px; background-color: white; cursor: default; list-style-image: none; ">Tortillas 
      <input style="float:right;" type="image" src="/images/next_level.png" alt="Submit button" onclick="newLevel(this)">
      <input style="float:right; margin-right: 7px;" type="image" src="/images/b_add.png" alt="Submit button" onclick="addItem(this)">
      <input style="float:right; margin-right: 7px" type="image" src="/images/b_edit.png" alt="Submit button" onclick="editItem(this)">
      <input style="float:right; margin-right: 7px" type="image" src="/images/b_drop.png" alt="Submit button" onclick="delItem(this)">

ご覧のとおり、買い物リストをデータベースに保存しようとしています。クロスサイト スクリプティング フィルターの問題を理解しているので、http ポスト メソッドを介して js を送信すると問題が発生し、同じコードが http 応答を介して返されます。このコード ブロックに js が表示されないため、問題を誤解している可能性があります。

したがって、このjs変数の内容を非表示の入力フォーム要素に書き込み、フォームを送信することを望んでいました:

   function saveList()
  {
     var list = $('ul').html();
     document.getElementById("html_passed").value = list;
     document.forms["editsForm"].submit();
  }

フォームの定義は次のとおりです。

<form name="editsForm" action="/cgi-bin/todo2.py" method="post">
  ...
  <input id="html_passed" type="hidden" name="html_passed">
  ...
</form>

次に、python cgi スクリプト (todo2.py) が実行されたときに、このフォーム要素の値を読み取ります。

form = cgi.FieldStorage()

if form.keys() != []:
  if 'html_passed' in form.keys():

次に、このコード ブロックを MySQLdb 経由で mysql db に配置します。ただし、フォームの内容を読み取ろうとするとform = cgi.FieldStorage()、Webkit コンソールに次のエラーが表示されます。

 Refused to execute a JavaScript script. Source code of script found within request.

だから、私は少しジャムに入っています。クロスサイト スクリプティングの回避策に関する情報を見つけましたが、Python で非標準の HTTP ヘッダーを送信する方法や、送信できるかどうかさえわかりません。を使用してphpで実行できることがわかりますheader("X-XSS-Protection: 0");。しかし、この問題を回避する他の方法がある場合は、それを台無しにしたくありません。どんなアイデアでも大歓迎です。ありがとう。

4

1 に答える 1

0

javascript/jquery のスキルを磨くことにしました。問題を引き起こしているのは実際にオンクリックであることがわかりました。したがって、回避策として、フォームを送信する前にそれらを削除しました：

  function rmOnClicks()
  {
    console.log('entered rmOnClicks()')
    $('li').children().each(function(index) 
    {
      $(this).removeAttr("onclick");
      //alert($(this).text());
    });
  }

次に、データベースからデータをリコールしたときにそれらを追加しました：

function addOnClicks()
  {
    console.log('entered rmOnClicks()')
    $('li').children().each(function(index) 
    {
      var src = $(this).attr('src');

            if (src == "/images/b_drop.png") 
      {
        $(this).removeAttr("onclick");
        $(this).attr('onclick','delItem(this)')
      }
      else if (src == "/images/b_edit.png") 
      {
        $(this).removeAttr("onclick");
        $(this).attr('onclick','editItem(this)')
      }
      else if (src == "/images/b_add.png") 
      {
        $(this).removeAttr("onclick");
        $(this).attr('onclick','addItem(this)')
      }
      else if (src == "/images/next_level.png") 
      {
        $(this).removeAttr("onclick");
        $(this).attr('onclick','newLevel(this)')
      }

    });

    var list = $('ul').html();
    console.log(list);
}

ややこしいですが、かなり頑丈だと思います。他にもアイデアがあれば、引き続きお聞きしたいと思います。ありがとう。

于 2012-08-07T05:39:34.080 に答える