Question

我有一个简单的PHP脚本，最多可能需要15秒才能完成。我想添加一个加载gif，我希望将其全部保留在一页上

我是一个相对的菜鸟，我有一个php脚本，该脚本根据传递给脚本的值执行多个任务。例如，在某种形式的提交中，传递了一个值为'getSegments'的隐藏值“ task”，这是来自getSegments任务的一些php

if ($task == 'getSegments') {

include('include/pre.content.php');

$response = [];
exec('/usr/bin/phantomjs phantomjstest.js', $response);

$data = $response[19];

// code that parses $data and builds $output

echo $output;

include('include/post.content.php');

}

从用户提交表单到返回并解析$ response，最多可能需要15秒。添加“ loading.gif”以在此期间显示的最简单/最佳方法是什么？

除了将代码添加到我的css文件以及pre.content.php（其中包含开始标记，包括并包括结束标记）之外，我更希望将所有内容保留在一个php脚本中，以及post.content.php，其中包含我的页脚，版权以及结束正文和html标签。

谢谢。

更新01-22-2019

根据Eriks的建议，我创建了以下phantomtest.php文件进行测试：

<!DOCTYPE html>
<html>
<head>

<meta charset="utf-8"/>
<meta content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" name="viewport">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

</head>
<body>

<img src="images/loading3.gif" id="loading-gif">

<script>
$('#loading-gif').hide();
// $('#task_start_butt').click(function()
$(document).ready(function()
{
    $('#loading-gif').show();
    $.ajax({url:”pathTo getSegments.php"}).done(function(data){
        $('#loading-gif').hide();
        // display the result here
        doSomethingOnComplete(data);
    });
});
</script>

<?php

function doSomethingOnComplete($response)
{
// do here your work
$data = $response[19];
echo "Data = $data";
}

?>

</body>
</html>

和getSegments.php

<?php

$response = [];
exec('/usr/bin/phantomjs phantomjstest.js', $response);
$data = $response[19];
echo $data;

?>

我更改了Eriks的台词

$('#task_start_butt').click(function()

到

 $(document).ready(function()

因为当用户来自表单时，我希望脚本在页面加载时启动。我认为脚本运行正常，因为在每次运行phantomtest.php时，loading3.gif都会在预期范围内显示不同的时间，然后在调用getSegments.php时将其隐藏。阿贾克斯完成（我认为）。但是，我无法显示getSegments.php的输出。

如果有人对如何做到这一点提出建议，我将不胜感激。谢谢。

我进一步更新并移动了

function doSomethingOnComplete($response)

将

移出php部分，并将其放入脚本部分。现在，我可以输出数字11了

document.write(5 + 6);

所以现在我所需要的就是如何将getSegments.php中的结果转换为phantomtest.php。

Answer 1

您可以使用ajax调用任务，并使用JS显示/隐藏加载动画。

HTML / JS（假设使用jQuery）：

Error: "Network error: Error writing result to store for query: {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","variableDefinitions":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"clientes"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"order"},"value":{"kind":"ObjectValue","fields":[{"kind":"ObjectField","name":{"kind":"Name","value":"nombre"},"value":{"kind":"StringValue","value":"ASC","block":false}}]}}],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"edges"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"node"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"nombre"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"abreviatura"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"codigoReeup"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"descripcion"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"observaciones"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"ultimaDocEntregadaAt"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"domicilioLegal"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"telefonos"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"emails"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"sitioWeb"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"organismo"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"denominacion"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"categoria"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"denominacion"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}}]}}],"loc":{"start":0,"end":310}} 

Store error: the application attempted to write an object with no provided id but the store already contains an id of Organismo:/api/organismos/50b4a4b2-638d-486e-80e0-bab276a722e5 for this object. The selectionSet that was trying to be written is: {"kind":"Field","name":{"kind":"Name","value":"organismo"},"arguments":[],"directives":[],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"denominacion"},"arguments":[],"directives":[]},{"kind":"Field","name":{"kind":"Name","value":"__typename"}}]}}"

您还需要修改php以仅返回要显示的数据。

Answer 2

有效！

php：

@forelse

JS：

$response = [];
exec('/usr/bin/phantomjs phantomjstest.js', $response);
echo json_encode($response[19]);

如何在不使该脚本变成2页的情况下向该脚本添加加载gif文件

2 个答案: