我当前正在使用在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.html
Blob存储上的文件。这样可能会起作用,但是URL始终类似于https://xxx.blob.core.windows.net/jsscripts/index.html
,这是不可取的,因为如果blob存储名称(xxx)更改,则指向该站点的每个链接也会中断。
我的问题是:
当前是否有通过Web API / OWIN提供静态文件的解决方案?还是即将发布的Web API 2版本中有任何解决方案?
解决方案,对我有用:
根据我的第一个解决方案,我通过Web API控制器提供index.html
和bootstrapper.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] 删除。
我来说两句