Блог

Я пишу приложение, которое загружает файлы в iframe. Он работает с файлами .pdf и изображениями, но не с .файлы djvu. Адрес файла передается в iframe через AngularJS (версия v1.2)

Когда я пытаюсь загрузить файл .djvu, я получаю ошибку 404.3 Not found. Ниже представлен визуализируемый вид:

Index.cshtml

 @model string
<div ng-controller="FileBrowserController" ng-init="getFiles('@Model')" style="width:100%;position:absolute;top:0;bottom:0;">
    <div class="row text-center" ng-show="showButtons" style="margin-bottom:5px">
        <div class="col-xs-1">
            <!--<button ng-show="f"  type="button" class="btn btn-sm btn-primary" ng-click="deleteFile()" ng-confirm-click="Are you sure that you want to delete this file?">Delete</button>-->
        </div>
        <div class="col-xs-10">
            <button ng-show="showButtons" type="button" class="btn btn-sm btn-primary" ng-disabled="currentFile.sortOrder==1" ng-click="previousFile()">Previous</button>
            <select ng-model="currentFile" ng-show="showButtons"
                    ng-options="file.sortOrder for file in files"
                    ng-change="setFile()"></select>
            <button ng-show="showButtons" type="button" class="btn btn-sm btn-primary" ng-disabled="currentFile.sortOrder==files.length" ng-click="nextFile()">Next</button>
        </div>
        <div class="col-xs-1"> </div>

    </div>

    <iframe style="min-height:100%;min-width:100%" ng-src="{{currentFileUrl}}"></iframe> 

    <!-- Modal -->
    <div class="modal fade" id="getdjvuPluginModal" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">amp;times;</span></button>
                    <h4 class="modal-title" id="modalLabel">Get DjVu Viewer browser plugin</h4>
                </div>
                <div class="modal-body">
                    <div>
                        <p>It doesn't look like you have installed a plugin to view ".djvu" files with.</p>
                    </div>
                    <p>
                        <strong>If you are using Internet Explorer, Firefox, or Safari:</strong>
                    </p>
                    <p>
                        Download the DjVu Browser Plug-in for Internet Explorer, Firefox and Safari. Please click <strong><a ng-href="{{djvuPluginUrl}}" target="_blank">here</a></strong> to go to the download page.
                    </p>
                    <p>
                        <strong>If you are using Chrome:</strong>
                    </p>
                    <p>
                        Download the DjVu Viewer Extension for Google Chrome. Please click <strong><a ng-href="{{chromePluginUrl}}" target="_blank">here</a></strong> to go to the Google Play store and download the plugin.
                    </p>
                    <hr />
                    <div>If you already have the plugin installed and think you are seeing this message in error then please reload the page.</div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>

</div>

@Scripts.Render("~/app/documents/detectDjVuPlugin.js")
  

AngularJS передает URL-адрес в iframe в качестве URL-адреса доверенного ресурса

 $scope.currentFileUrl = $sce.trustAsResourceUrl($scope.currentFile.fileUrl);
  

Я попытался выполнить рекомендуемые шаги:

• Добавлен обработчик в Web.config

<system.webServer>
...
<staticContent>
<!-- .DjVu files handler -->
<mimeMap fileExtension=".djvu" mimeType="image/vnd.djvu"/>
<mimeMap fileExtension=".djv" mimeType="image/vnd.djvu"/>
</staticContent>

• Добавлен MIME-тип в IIS
• Проверил, установлен ли плагин djvu (я могу нормально загружать файлы djvu из Интернета)
• Установка URL-адреса файла в качестве источника для <embed> тега, который приложение запускает на .Net 4.0, серверной части C # и AngularJS.

Я в недоумении относительно того, как получить эту загрузку.

После долгих проб и ошибок я получил эту работу. В итоге мне пришлось переключиться с использования IIS Express на полноценный IIS и добавить туда типы MIME.

Стоит отметить, что когда mimeMap была добавлена в web.config приложения, Internet Explorer 11 не обнаружил ее и не смог отобразить файлы djvu (та же ошибка 404.3, что и раньше), но Chrome был достаточно доволен.

Для того, чтобы получить .отображение файлов djvu в IE 11 Мне пришлось добавить mimeMap на корневой сайт или хост приложения. Это можно сделать через диспетчер IIS; или через файлы wwwroot Web.Config или applicationhost.config соответственно.