PDFTron XOD 查看器未在 ASP.NET Core MVC 6 Razor View 上加载

PDFTron XOD Viewer not loading on ASP.NET Core MVC 6 Razor View

PDFTron XOD 查看器未在 ASP.NET Core MVC 6 Razor View 上加载 XOD 文件。检查浏览器控制台显示错误:"Browser Link: Failed to invoke return value callback: TypeError: Unable to get property 'files' of undefined or null reference".

浏览器显示消息:"Please" 代替 WebViewer 控件。我看到这来自代码部分的 PDFTron WebViewer.js 文件,如下所示:

else {
            var supportErrorArray = new Array();
            supportErrorArray.push("Please");
            if (allowHTML5) {
                supportErrorArray.push("use an HTML5 compatible browser");
                if (allowSilverlight || allowFlash) {
                    supportErrorArray.push("or");
                }

me.selectedType is none 来自 WebVeiwer.js 当我在 WebViewer.js 文件中放置警报时。 PDFTron XODViewer 不支持 ASP.NET Core MVC 6 吗?

我使用变通方法通过检查来更正 WebViewer.js 脚本:

if(me.selectedType == null)
{
     if (this.options.html5Options) {
                $.extend(this.options, this.options.html5Options);
            }
            me._createHTML5();
}

MVC 6 Razor View (Document/Index.cshtml) 标记如下:-

@model XODViewer.Models.Document

@{
    ViewBag.Title = "Document";
}

<script src="@Url.Content("~/lib/jquery/dist/jquery.js")"></script>
<script src="@Url.Content("~/lib/WebViewer.js")"></script>
<style>
    #viewer {
        width: 1024px;
        height: 600px;
    }
</style>

<script>
    $(function () {
            var docName = '@Html.Raw(Model.DocumentName)';
            var viewerElement = document.getElementById('viewer');
            var myWebViewer = new PDFTron.WebViewer({
                path: '../../lib',
                type: '../../lib/html5',
                documentType: "xod",
                initialDoc: "../../XodFiles/GettingStarted.xod",
                config: '',
                streaming: false,
                enableAnnotations: false,
                enableOfflineMode: false,
                enableReadOnlyMode: true
            }, viewerElement);
        });
</script>

@Html.Raw(ViewBag.Message)

<div id="viewer" style="padding:10px; word-wrap:break-word;">
</div>

ASP.NET Core MVC 6 解决方案如所附屏幕截图所示。

我已经为 XOD 设置了如下内容类型:-

// Set up custom content types -associating file extension to MIME type
            var provider = new FileExtensionContentTypeProvider();
            // Add new mappings
            provider.Mappings[".json"] = "application/json";
            provider.Mappings[".woff"] = "application/font-woff";
            provider.Mappings[".res"] = "text/plain";
            provider.Mappings[".nmf"] = "text/plain";
            provider.Mappings[".pexe"] = "text/plain";
            provider.Mappings[".mem"] = "text/plain";
            provider.Mappings[".brotli"] = "text/plain";
            provider.Mappings[".xod"] = "application/vnd.ms-xpsdocument";
            // Remove MP4 videos.
            //provider.Mappings.Remove(".mp4");

            app.UseStaticFiles(new StaticFileOptions()
            {
                FileProvider = new PhysicalFileProvider(
                    Path.Combine(Directory.GetCurrentDirectory(), @"wwwroot", "XodFiles")),
                RequestPath = new PathString("/XodFiles"),
                ContentTypeProvider = provider
            });

最后,在运行 上解决,XOD Viewer 或XOD 文档不显示。解决方案截图运行页面和浏览器控制台如下图。

根据 Ryan 的建议升级到 WebViewer V2.2.2 后解决。