Question

我是Oracle-Apex的新手。我需要帮助才能在Oracle APEX中显示PDF。我有一个问题：我已将PDF上传到数据库中。我将PDF保存为数据库中的Blob。之后，我在经典报表中显示了PDF的名称。单击名称时，我想查看已上传的PDF的预览。现在，我正在寻找一种显示带有代码的PDF的方法。有人可以帮忙吗？

我需要上一个和下一个按钮。

我如何在该地区显示此PDF？here is my Page

Answer 1

以下是我使用APEX_APPLICATION_TEMP_FILES快速讲过的一个例子。希望这是您要实现的目标。 https://apex.oracle.com/pls/apex/f?p=34781

用户名：demo
密码：演示

这使用Mozilla的PDF.js项目。这是您可能需要的快速食谱。

创建一个File Browse页面项目，并将“存储类型”设置为Table APEX_APPLICATION_TEMP_FILES。
创建页面按钮以提交页面。

创建经典报表区域并输入以下查询：

select
    id
    , filename
from apex_application_temp_files
where application_id = :APP_ID

添加虚拟列并设置HTML表达式：

<button type="button" class="btn-preview-pdf" data-id="#ID#">Preview</button>

创建一个区域，然后在Source中输入以下内容：
```
<canvas id="preview-pane"></canvas> 
```
创建点击动态操作。

a。将选择类型设置为jQuery Selector。

b。输入jQuery选择器.btn-preview-pdf。

使用以下JS代码添加一个Execute JavaScript Code动作（请查看PDF.js网站上的示例以获取有关代码功能的更多详细信息）：

var fileId = $(this.triggeringElement).data('id');
var docUrl = 'f?p=&APP_ID.:0:&APP_SESSION.:APPLICATION_PROCESS=DOWNLOADPDF:::FILE_ID:' + fileId;
var previewPane = this.affectedElements[0];

// from PDF.js examples
pdfjsLib.getDocument(docUrl).then(function(pdf) {
    var pageNumber = 1;
    pdf.getPage(pageNumber).then(function(page) {
        console.log('Page loaded');

        var scale = 1.5;
        var viewport = page.getViewport(scale);

        // Prepare canvas using PDF page dimensions
        var canvas = previewPane;
        var context = canvas.getContext('2d');
        canvas.height = viewport.height;
        canvas.width = viewport.width;

        // Render PDF page into canvas context
        var renderContext = {
            canvasContext: context,
            viewport: viewport
        };
        var renderTask = page.render(renderContext);
        renderTask.then(function () {
            console.log('Page rendered');
        });
    })
}, function(reason) {
    console.error(reason);
});

对于操作，还设置“受影响的元素”：

a。选择类型：jQuery Selector

b。 jQuery选择器：#preview-pane

遵循Joel Kallman的post创建下载文件的链接。您将需要一个应用程序流程（DOWNLOADPDF）和一个应用程序项（FILE_ID）。应用程序流程DOWNLOADPDF的修改后的代码如下所示：

begin
    for file in (select *
                from apex_application_temp_files
                where id = :FILE_ID) loop
        --
        sys.htp.init;
        sys.owa_util.mime_header( file.mime_type, FALSE );
        sys.htp.p('Content-length: ' || sys.dbms_lob.getlength( file.blob_content));
        sys.htp.p('Content-Disposition: attachment; filename="' || file.filename || '"' );
        sys.htp.p('Cache-Control: max-age=3600');  -- tell the browser to cache for one hour, adjust as necessary
        sys.owa_util.http_header_close;
        sys.wpg_docload.download_file( file.blob_content );

        apex_application.stop_apex_engine;
    end loop;
end;

几乎错过了这一点。在页面属性上，将JavaScript文件URL设置为任何CDN listed。例如：

// cdnjs.cloudflare.com/ajax/libs/pdf.js/2.0.550/pdf.min.js

请注意，这是一个非常基本的原型。预览仅允许您查看第一页。您将需要找出API，然后进行必要的操作以允许多页查看。我会让你弄清楚。

应该的。让我知道这是否对您不起作用。

Oracle Apex PDF查看器

1 个答案: