angularjs 科尔多瓦基础 href

Question

尝试为 angularjs html5 网络应用程序设置正确的 base href 值以在 cordova

中工作

最初使用 $locationProvider.html5Mode(true) 和 <base href="/">：

应用程序在普通浏览器中运行完美
cordova 为 css/js/templates 等提供资源错误
（我相信它在 cordova 根目录而不是平台根目录中寻找资源？）

尝试了一些在 SO 和 ui-router FAQs:

上浮动的替代方案

<base href="."> 使用 html5 模式根据 this 答案：

在 cordova 中发现资产正常（没有资源错误）
ui-路由器进入无限循环的尾旋和以下错误消息
Error: Failed to execute 'pushState' on 'History': A history state object with URL 'https://page/' cannot be created in a document with origin https://example.com

<base href="./"> 与 html5 模式：

在 cordova 中找到资产（无资源错误）
给我可怕的 Error: 10 $digest() iterations reached. Aborting! 消息尝试使用 frankwallis solution mentioned here 但没有帮助（同样的错误）

没有 base href 有 $locationProvider.html5Mode({enabled: true, requireBase: false});

在 cordova 中找到资产（无资源错误）
页面开始自行加载 ?? ...喜欢 angular bootstraps 在 some 州两次？

我的应用配置定义如下：

myApp.config(['$locationProvider', '$urlRouterProvider', '$stateProvider', '$stickyStateProvider', function($locationProvider, $urlRouterProvider, $stateProvider, $stickyStateProvider) {

    $locationProvider.html5Mode(true);

    $stateProvider
    .state('root', {            // we define a 'root' state so that we can load some essential data prior to any template being loaded
        url: '',
        abstract: true,
        sticky: true,
        views: {
            'root': {
                template: '<ui-view/>',
            }
        }
    })
    .state('root.worldmap', {
        url : '/worldmap',
        templateUrl : 'templates/worldmap.tmpl.html'
    })
    .state('root.faq', {
        url : '/faq',
        templateUrl : 'templates/faq.tmpl.html'
    })
    .state("otherwise", {
        url: "*path",
        views: {
            'root': {
                template: "",
                controller: ['$injector', function($injector) {
                    var $state = $injector.get("$state");
                    $state.go('root.worldmap');
                }]
            }
        },
    });
    $stickyStateProvider.enableDebug(true);
}]);

有关信息：使用 this method 的替代 cordova deviceready vs angular.element bootstrap 分别用于 cordova / 浏览器

Answer 1

好的，让这个工作的方法是删除基本 href AND 禁用 html5 模式：

[可选] 创建并签出一个名为 dev-cordova 或类似的新分支
- 这允许您在浏览器和设备代码之间快速切换
删除/评论主<base href="/"> index.html

确保html5模式在app.js中被禁用

$locationProvider.html5Mode({
    enabled: false,
    requireBase: false
});

或

$locationProvider.html5Mode(false);

不要忘记运行 cordova build ios（在你 g运行t / gulp 等编译 js 文件之后）
...这确保更新 cordova /platforms/ios/www 目录中的文件。

angularjs 科尔多瓦基础 href

angularjs cordova base href

angularjs

html

cordova

angular-ui-router

angular-ui-router-extras