3
\$\begingroup\$

I am making a web editor for fun and I was told that the way I was doing it (using PHP) would be a bad way. I also thought about it while I was making it, and in massive sums of data transfer it would be a bad idea to do it this way. I can't think of another way to do it and was looking for someone to help me improve it, by that I mean my save method I am using.

Editor:

<html>

  <head>
    <title>Web Editor</title>
    <link href="controller.css" rel="stylesheet" />
    <script type="text/javascript" src="script/editor.js"></script>
  </head>

  <body>
    <div class="platform">
      <div class="head">
        <div class="file">
          <p>File:
            <div id="file">C:\hello.html</div>
          </p>
        </div>
      </div>
      <div class="hotbar">
        <img src="images/save.png" class="hotbarImage" onClick="save()" />
      </div>
      <div class="editor">
        <div contenteditable="true" style="height:100%; overflow:scroll;" id="editPad"></div>
      </div>
    </div>
  </body>

</html>

JS:

function save() {
  var dir = document.getElementById("file").innerHTML;
  var data = document.getElementById("editPad").innerHTML;
  window.location = "save.php?dir=" + encodeURIComponent(dir) + "&data=" + encodeURIComponent(data);
}

PHP:

<?php
    $dir = $_GET['dir'];
    $data = $_GET['data'];
    $lookFor = array("&lt;", "&gt;","<br>","<%2Fdiv>","<div>","</div>");
    $replaceWith = array("<", ">", "", "", "","");
    $newData = str_replace($lookFor,$replaceWith,$data);

    $f = fopen(urldecode($dir),"w");
    fwrite($f,urldecode($newData));
    fclose($f);
?>

All of it is just a work in progress and I need more done. But for right now, is there a better way for me to save the file with massive sums of data being transferred?

\$\endgroup\$
  • \$\begingroup\$ How much data do you expect per transfer? \$\endgroup\$ – Quentin Pradet May 23 '13 at 6:27
  • \$\begingroup\$ Up to a MB. That should probably be the largest amount. \$\endgroup\$ – Matthew May 23 '13 at 20:37
2
\$\begingroup\$
  • I'd prefer a form with a textarea rather than a contenteditable element. Forms and text areas were built for that purpose.

  • As for your save code, GET requests should not do anything on the server. It should only do what it was called to do, and that is to get data. I suggest you do a POST or PUT instead by using a form, or via AJAX.

  • An advantage of AJAX compared to forms is that you won't leave your page. Similar to how you did it, you grab the data and send it to the server.

  • Your editor is risky since it can write to an arbitrary file on the server (or worse, on the system). With this code, I can modify this PHP file itself and make it do all kinds of stuff. I suggest you do some research on how you can restrict where and what you can modify.

  • You need a more robust approach in stripping HTML from the data than doing it manually. PHP has some built-in functions to do that for you, like strip_tags. There could be better solutions that I'm not aware of as well.

  • Massive data? How much data do you expect you put in anyway? I suggest polishing the implementation first before optimizing for other stuff, like data size and so on.

\$\endgroup\$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.