簡體   English   中英

在Octobercms中,如何使用AJAX下載文件而不進行頁面引用?

[英]How to use AJAX to download files without page referesh in Octobercms?

我是laravel和10月cms的新手。 我想添加一個按鈕,以允許用戶下載PDF文件'a.pdf',而無需定向到新頁面。 我知道我必須使用AJAX並發送下載http響應,以使瀏覽器顯示“另存為...”對話框。 到目前為止,這是我已經完成的工作:

title = "Sandbox"
url = "/test"
layout = "default"
==
<?php
function onDownload()
{
    $pathToFile = Url::to("/storage/app/media/a.pdf");
    $fileName = "download.pdf";
    $headers = [
        'HTTP/1.1 200 OK',
        'Pragma: public',
        'Content-Type: application/pdf'
    ];
    return Response::download($pathToFile, $fileName, $headers);
}
?>
==
<div class="container">
    <form class="form-inline" data-request="onDownload">
        <button type="submit" class="btn btn-primary" data-attach-loading>Download</button>
    </form>
</div>

使用上述代碼,我收到“文件” http://localhost/october/storage/app/media/a.pdf “不存在”錯誤。

我究竟做錯了什么?

請將標頭更改為關聯數組,

$headers = array(
                 'Content-Type'=>'application/pdf',
           );

對於可能會覺得有用的任何人( 這適用於通過媒體管理器上傳的文件 )。 通過在我的布局代碼php部分添加AJAX處理程序來完成此工作。

function onDownloadButtonClicked(){

    $pathToFile = base_path('storage/app/media/path/actual filename here');
    $fileName = "filename shown on download here";
    $headers = [
        'HTTP/1.1 200 OK',
        'Pragma: public',
        'Content-Type: application/pdf'
    ];
    return Response::download($pathToFile, $fileName, $headers);
}

在頁面和局部上添加了此

{{ form_open({ request: 'onDownloadButtonClicked' }) }}
<button type="submit" class="tg-btn tg-btnicon" data-attach-loading>
    <i class="fa fa-file-pdf-o"></i> Download Here
</button>
{{ form_close() }}

更新 :對於使用插件Octobercms通過后端上傳的文件,它會生成動態鏈接。 要下載文件,只需創建一個前端組件。 遵循簡單的教程Watch +學習創建一個簡單的插件模型,用於后端上傳和母帶組件的准系統前端下載組件。 獲取文件詳細信息后,將使用簡單的href進行文件下載。

<a href="{{ post.attachment.path }}"
            download="{{ post.attachment.file_name }}"><i class="fa fa-download"></i> &nbsp Download File</a>

名稱插件和附件可以是任何東西,具體取決於插件模型的形式設計。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM