通过Web API提供静态内容

Question

通过Web API提供静态内容

Rob*_*bar 6 azure azure-storage asp.net-web-api

我目前正在使用在OWIN/Katana上运行的WebAPI(在Windows Azure辅助角色实例上).客户端(使用HTML,CSS和Javascript的主页构建)通过REST接口与WebAPI交互.

静态/客户端相关文件(如HTML,CSS,Javascript,Images,...)将保存在Windows Azure Blob存储中.

我现在想通过WebAPI/OWIN提供这个静态内容.

第一个解决方案是从blob存储加载文件并将路由映射到控制器,该控制器返回此文件的blob内容HttpResponse(参见此处)

这适用于一个文件,但我index.html包括其他CSS和Javascript文件.所以浏览器开始寻找@ http://[OWIN-Web-Server-URL]/anotherJSfile.js并且当然找不到任何东西,因为没有为此定义路由.我不能/不想为每个文件定义路由,因为客户端应该从Blob存储中获取文件,而不需要绕过Web服务器(1-2索引/启动文件是可以接受的,但是一切其他应该通过blob存储服务).

第二次尝试是使用一些提供"静态内容"的外部库 - 功能,但它们都不起作用并处于alpha状态(参见此处或此处).

第三种并不完全可以接受的解决方案是重定向http://[OWIN-Web-Server-URL]/到index.htmlblob存储上的文件.这样它可能会起作用,但URL总是类似的https://xxx.blob.core.windows.net/jsscripts/index.html,这不是优选的,因为如果blob存储名称(xxx)会改变,那么到站点的每个链接也会中断.

我的问题是:

目前是否有任何通过Web API/OWIN提供静态文件的解决方案？或者即将推出的Web API 2版本中是否有任何解决方案？

Answer 1

Rob*_*bar 3

解决方案，对我有用：

根据我的第一个解决方案，我通过 Web API 控制器提供一个index.html和一个文件。bootstrapper.js

该index.html文件将从 blob 存储加载，在服务器上格式化（获取存储帐户端点 url： https: //xxx.blob.core.windows.net/）并通过HttpResponse（mediatype：text/html）返回。将仅通过（媒体类型：application/javascript）bootstrapper.js加载并返回。HttpResponse

该index.html文件现在使用bootstrapper.js正确的源 URL 来调用剩余静态内容的文件。剩余的内容将从给定的源 URL 相对加载。

在我们的生产系统中，源 URL 指向 blob 存储，在开发环境中， URL 指向本地 Web 服务器。这是必需的，因为Web 服务器提供的 HTML 文件无法访问文件系统上的文件。因此，需要一个 Web 服务器（我们使用 WebStorm 中内置的 Web 服务器）来提供这些文件。

index.html文件：

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="UTF-8">
    <title>Main Page</title>
    <script type="text/javascript" src="bootstrap-app.js"></script>
    <script type="text/javascript">bootstrapApp('{0}');</script>
</head>
<body></body>
</html>

Run Code Online (Sandbox Code Playgroud)

bootstrapper.js文件：

/**
 * Loads all needed files asynchronously into the html file
 */
window.bootstrapApp = function(baseUrl) {
    "use strict";
    var i, assetUrls;

    window.baseUrl = baseUrl;

    assetUrls = [   'https://cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/codemirror.min.css',
        'https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js',
        'https://cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.0.6/jquery.mousewheel.min.js',
        'https://cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/codemirror.min.js',
        baseUrl + '../lib/xxx.js',
        baseUrl + '../lib/xxx/xxx.js',
        baseUrl + 'resources/xxx.css',
        baseUrl + 'xxx.js'
    ];

    function endsWidth(string, suffix) {
        return (string.indexOf(suffix, string.length - suffix.length) !== -1);
    }

    // Load all assets from the previously defined array asynchronously in the order they are given in the array
    for (i = 0; i < assetUrls.length; i++) {
        // Load css or js asset
        if (endsWidth(assetUrls[i], 'css')) {
            document.write('<link rel="stylesheet" type="text/css" href="' + assetUrls[i] + '" />');
        } else if (endsWidth(assetUrls[i], 'js')) {
            document.write('<script type="text/javascript" src="' + assetUrls[i] + '"></script>');
        }
    }
};

Run Code Online (Sandbox Code Playgroud)

归档时间：	12 年，3 月前
查看次数：	3550 次
最近记录：	12 年，3 月前