使用DurandalJs加载远程视图

时间:2014-03-17 06:39:23

标签: javascript requirejs durandal durandal-2.0

我正在学习DurandalJs并尝试从其他域加载远程视图,但是,requireJs会继续将'.js'附加到我的html视图的url,从而导致404错误。我的目标是设置一个框架,我可以利用我的应用程序为不同的客户重用html代码段。这是我的客户端应用程序的index.html文件中对requirejs的调用:

< script src="http://myframework.com/lib/require/require.js" 
  data-main="http://myframework.com/lib/framework"></script>

注意我从一个完全不同的域加载require.js而不是我的客户端应用程序。我正在将我的应用程序的入口点设置为myframework.com服务器上存在的framework.js。这是farmework.js:

    var framework = 'http://myframework.com/';

    require.config({

        baseUrl: 'app/',

        //Framework paths
        paths: 
        {
            'framework':        framework,
            'appBase':          framework + 'appBase',
            'lib'      :        framework + 'lib',      
            'durandal':         framework + 'lib/durandal',
            'jquery':           framework + 'lib/jquery/jquery-2.1.0.min',
            'knockout':         framework + 'lib/knockout/knockout-3.1.0'
             ...
        },
        urlArgs: 'v=5.1.0.5'
    });

    require(['main']);

在我的远程服务器上运行framework.js之后,我在框架中建立了一组资源路径。我还将baseUrl设置为“app”,它位于我的客户端实现上。因此,最终结果是我有一组远程资源和一组本地资源。请参阅此链接:SO source for how I accomplished this

无论如何,一切都在努力到这一步。我可以加载我的远程资源。我可以在我的客户端加载'main'。尝试加载远程视图模型和关联视图时会发生此问题。我有一个'appBase'路径,我希望在我的应用程序的不同实现中加载常见的viewModel和视图。我按照以下方式设置了我的路线:

define(['plugins/router'], function (router)
{
    return {
        router: router,
        activate: function () {
            return router.map([
                { route: ['', 'home'], moduleId: 'appBase/viewmodels/home',title: 'Welcome'},
            ]).mapUnknownRoutes('hello/index', 'not-found')
              .activate();
        }
    };
});

注意,我正在使用'appBase / viewmodels / home'作为moduleId。 appBase是我框架中建立的指向远程服务器上某个位置的路径之一。 requireJs正在寻找远程资源的路径,但它将'.js'附加到html文件扩展名,导致找不到404。 requireJs正在制作这个:

http://myframework.com/appBase/views/home.html.js

有关如何使DurandalJs在远程服务器上加载viewmodule及其视图的任何想法?为什么.js被附加到html资源的Url?谢谢你的帮助。

1 个答案:

答案 0 :(得分:0)

我想出了如何删除&#39; .js&#39;延期。它与跨域请求有关。这里找到非常简单的解决方案:

http://rockycode.com/blog/cross-domain-requirejs-text/