通过Web API提供静态内容

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

与静态/客户端相关的文件(如HTML,CSS,Javascript,图像等)将保存在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版本中有任何解决方案?

解决方案,对我有用:

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

index.html文件将从blob存储加载,在服务器上格式化(获取存储帐户端点URL:https : //xxx.blob.core.windows.net/),并通过HttpResponse(媒体类型:text / html)返回。bootstrapper.js只会被加载,并通过返回HttpResponse(介质类型:应用程序/ JavaScript的)。

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>

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>');
        }
    }
};

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

通过cachall路由提供静态内容-Express

来自分类Dev

netty.io提供静态Web内容

来自分类Dev

通过Apache为Web应用程序提供多语言静态内容

来自分类Dev

通过Web API 2流视频内容

来自分类Dev

金字塔调试工具栏通过HTTP而不是HTTPS提供静态内容

来自分类Dev

如何从内部服务器在 Java Web 应用程序中提供静态内容?

来自分类Dev

提供静态内容NGINX

来自分类Dev

提供静态内容NGINX

来自分类Dev

无论Web服务器设置如何,都可以通过HTTPS提供所有内容

来自分类Dev

如何从来自不同区域的多个存储桶支持的 S3 中提供静态 Web 内容

来自分类Dev

Golang Goji:如何同时提供静态内容和api

来自分类Dev

Nginx:通过URL路径提供静态文件

来自分类Dev

Nginx:通过URL路径提供静态文件

来自分类Dev

如何通过Flask处理Web API

来自分类Dev

通过Web Api接收,发送文件

来自分类Dev

通过其Web API获取OneNote页面

来自分类Dev

如何通过Web API调用存储过程

来自分类Dev

通过文件请求到Web API

来自分类Dev

通过Web Api接收,发送文件

来自分类Dev

WPF通过SSL进行Web api调用

来自分类Dev

如何通过Steam Web API拒绝TradeOffer?

来自分类Dev

未经授权:通过Web API拒绝访问

来自分类Dev

通过Web与Python连接到API

来自分类Dev

如何通过 Web API 返回图像

来自分类Dev

通过Microsoft Web API端点调用Web服务-asmx?

来自分类Dev

如何通过动态页面内容使元素静态

来自分类Dev

Web.py不提供静态文件

来自分类Dev

如何使用通过OWIN自托管的Web API来提供index.html

来自分类Dev

Spring Web开发-禁用静态内容缓存