実際に膨大な量のデータをPOSTしようとするのではなく、問題のドキュメント/ページのURLをPHPスクリプトにPOSTしてから、DOM操作を使って目的のコンテンツを見つけることができます。それはリクエストをかなり速くし、POSTされたデータに関しては何の制限もなくなります。
ajax関数をjQueryバージョンに簡単に置き換えることができます。jQueryは使用しません。
フォームのボタンはtradionalの意味でフォームを送信しませんが、ページ&をバックエンドのPHPコードに送信するajaxリクエストをトリガします。
<?php
if($_SERVER['REQUEST_METHOD']=='POST' && isset($_POST['username'], $_POST['page']) && !empty($_POST['page'])){
ob_clean();
$username=filter_input(INPUT_POST, 'username', FILTER_SANITIZE_STRING);
/* change path to suit environment */
$targetfile='c:/temp/'.$username.'.html';
libxml_use_internal_errors(true);
/* Load the current or selected page into a new DOMDocument */
$dom=new DOMDocument;
$dom->validateOnParse=false;
$dom->standalone=true;
$dom->strictErrorChecking=false;
$dom->recover=true;
$dom->loadHTMLFile($_POST['page']);
/* Find the element in the DOM to save */
$div = $dom->getElementById('main');
/* Save copy to this Document */
$doc=new DOMDocument;
/* Create a cloned copy of the DIV */
$clone=$div->cloneNode(true);
/* Add the clone to our new document */
$doc->appendChild($doc->importNode($clone, true));
/* write the cloned node innerHTML to file */
$bytes = file_put_contents($targetfile, $doc->saveHTML());
libxml_clear_errors();
$dom = $doc = null;
/* send some feedback to the client */
exit('Bytes written: '.$bytes.' to '.$targetfile);
}
?>
<!doctype html>
<html>
<head>
<title>Create File via AJAX & DOMDocument</title>
<script type='text/javascript'>
/* simple ajax function for post & get requests */
function ajax(m,u,p,c,o){
/*method,url,params,callback,options*/
var xhr=new XMLHttpRequest();
xhr.onreadystatechange=function(){
if(xhr.readyState==4 && xhr.status==200)c.call(this, xhr.response, o, xhr.getAllResponseHeaders());
};
var params=[];
for(var n in p)params.push(n+'='+p[n]);
switch(m.toLowerCase()){
case 'post': p=params.join('&'); break;
case 'get': u+='?'+params.join('&'); p=null; break;
}
xhr.open(m.toUpperCase(), u, true);
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.send(p);
}
/* Add event listener to the button */
document.addEventListener('DOMContentLoaded',function(e){
document.getElementById('btn').addEventListener('click',function(e){
var username=document.getElementById('usr').value;
if(username!=''){
ajax.call(this, 'post', location.href, { page:location.href, username:username }, function(r){
alert(r)
}, null);
}
},false);
},false);
</script>
</head>
<body>
<div id='main'>
<div class='new-classs' style='color:green;width:100px'>
<img src='/images/tarpit.png' />
<span>Content of #main div goes here</span>
<span>Content of #main div goes here</span>
<span>Content of #main div goes here</span>
<span>Content of #main div goes here</span>
<span>Content of #main div goes here</span>
<span>Content of #main div goes here</span>
<span>Content of #main div goes here</span>
<span>Content of #main div goes here</span>
<span>Content of #main div goes here</span>
<span>Content of #main div goes here</span>
<h2>more content...</h2>
<!-- lots and lots of contents -->
</div>
</div>
<form method='post'>
<input id='usr' type='text' name='user_name' class='user_name' required>
<input id='btn' type='button' value='submit' name='submit' class='submit'>
</form>
</body>
</html>
なぜ私の編集を元に戻しましたか？ https://stackoverflow.com/revisions/44781725/2 –
もう1つ編集できますか？私はコード間のスペースを減らすので、 –
要求のサイズ制限はサーバーの設定に依存しませんか？私は標準があるとは思っていませんし、あなたのサーバーによっては、より大きな要求を許可するように構成することができます。あなたはこの興味深いを見つけるかもしれない –