使用Ajax时如何在onComplete回调中调用指定接口？

首先，你需要把后端生成的$do接口地址传递到前端JS环境中，比如直接用PHP输出到页面的<script>标签里：

<script>
// 将后端接口地址转为前端可访问的变量
const readExcelApi = '<?php echo $do; ?>';
</script>

接下来，在配置qq.FileUploader时，在onComplete回调函数里发起Ajax请求调用读取Excel的接口，以下是两种常见实现方式：

原生JS实现 #

const uploader = new qq.FileUploader({
    // 已有配置
    action: '<?php echo $upload; ?>',
    onComplete: function(id, fileName, responseJSON) {
        // 先判断文件上传是否成功
        if (responseJSON.success) {
            const xhr = new XMLHttpRequest();
            // 拼接文件名参数（如果读取接口需要指定文件）
            const requestUrl = `${readExcelApi}?fileName=${encodeURIComponent(fileName)}`;
            xhr.open('GET', requestUrl, true);
            
            xhr.onload = function() {
                if (xhr.status >= 200 && xhr.status < 300) {
                    // 处理读取Excel后的响应数据
                    const result = JSON.parse(xhr.responseText);
                    console.log('Excel读取结果:', result);
                    // 这里可以添加数据展示等后续逻辑
                } else {
                    console.error('读取Excel失败:', xhr.statusText);
                }
            };
            
            xhr.onerror = function() {
                console.error('请求读取Excel接口出错');
            };
            
            xhr.send();
        } else {
            console.error('文件上传失败:', responseJSON.error);
        }
    }
});

jQuery简化实现（如果项目引入了jQuery） #

const uploader = new qq.FileUploader({
    action: '<?php echo $upload; ?>',
    onComplete: function(id, fileName, responseJSON) {
        if (responseJSON.success) {
            $.ajax({
                url: readExcelApi,
                type: 'GET',
                data: {
                    fileName: fileName
                },
                success: function(result) {
                    console.log('Excel读取结果:', result);
                    // 后续业务逻辑
                },
                error: function(xhr, status, error) {
                    console.error('读取Excel失败:', error);
                }
            });
        }
    }
});

注意事项 #

• 确保上传接口返回的responseJSON包含明确的成功标识（比如success: true），避免在上传失败时误触发读取接口。
• 传递文件名时用encodeURIComponent编码，防止特殊字符导致请求异常。
• 如果读取Excel接口需要POST请求，只需调整Ajax的type参数，并将数据放在data字段中即可。

内容的提问来源于stack exchange，提问作者Who I am