javascript - 使用 javascript 和 AngularJS 检测重写规则后面是否存在资源-6ren

javascript - 使用 javascript 和 AngularJS 检测重写规则后面是否存在资源

转载作者：行者123 更新时间：2023-11-28 02:10:58

25

4

我正在尝试仅使用 javascript 和 AngularJS 覆盖我的单页应用程序的部分内容。

覆盖基于子域。

每个子域都指向同一个文档根。

controllers.js

controller('AppController', ['$scope','$route','$routeParams','$location', function($scope, $route, $routeParams, $location) {    
  $scope.$on("$routeChangeSuccess",function( $currentRoute, $previousRoute ){
    render();
  });
  var render = function(){
    //Is it actually a subdomain?
    if($location.host().split(".",1).length>2){ 
      //Use subdomain folder if it is.
      var url = "views/"+$location.host().split(".",1)+"/"+$route.current.template;
      var http = new XMLHttpRequest();    
      http.onreadystatechange=function(){
        if (http.readyState==4){
          //If there isn't an overwrite, use the original.
          $scope.page = (http.status!=404)?url:("views/"+$route.current.template);
        }
      }
      http.open('HEAD', url, true);
      http.send();
    }
    else{
      //Else we are on the parent domain.
      $scope.page  = "views/"+$route.current.template;
    }
  };
}])

config.js

config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
  $locationProvider.html5Mode(true);
  $routeProvider.when('/', {
    template: 'home.html'
  });
  $routeProvider.when('/services', {
    template: 'services.html'
  });
  $routeProvider.otherwise({redirectTo: '/'});
}]);

index.html

<html lang="en" ng-app="myApp" ng-controller="AppController">
<body>
<div ng-include src="page" class="container"></div>
</body>
</html>

因为这是一个单页应用，所以当您直接点击 URL 时，将会出现 404。这就是我们在服务器上应用重写规则的原因。就我而言，我使用的是 nginx:

location / {
   try_files $uri /index.html;
}

当我不在子域上时，这非常有用，但我也没有发送 XMLHttpRequest。当我确实使用子域时，现在我们需要检查是否覆盖。

这里棘手的部分是重写规则强制 XMLHttpRequest 返回 200。

关于如何鱼与熊掌兼得的想法？

最佳答案

我决定采用本地策略有两个原因:

XML 请求没有额外的开销。
当资源不存在时，404 消息不会污染控制台日志。

services.js

factory('Views', function($location,$route,$routeParams,objExistsFilter) {

  var viewsService = {};
  var views = {
    subdomain1:{
      'home.html':'/views/subdomain1/home.html'
      },
    subdomain2:{

    },
    'home.html':'/views/home.html',
  };

  viewsService.returnView = function() {
    var y = $route.current.template;
    var x = $location.host().split(".");
    return (x.length>2)?(objExistsFilter(views[x[0]][y]))?views[x[0]][y]:views[y]:views[y];
  };

  viewsService.returnViews = function() {
    return views;
  };

  return viewsService;
}).

controllers.js

controller('AppController', ['$scope','Views', function($scope, Views) {    
  $scope.$on("$routeChangeSuccess",function( $currentRoute, $previousRoute ){
    $scope.page = Views.returnView();
  });
}]).

filters.js

filter('objExists', function () {
  return function (property) {
    try {
      return property;
    } catch (err) {
      return null
    }
  };
});

关于javascript - 使用 javascript 和 AngularJS 检测重写规则后面是否存在资源，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17095989/

25

4

0

文章推荐： c++ - 使用一些空指针初始化节点

文章推荐： css - 基于参数的 LESS mixin 返回值

文章推荐： javascript - 在 JavaScript 中更改图像的位置

mysql - 连接的子查询(存在/存在)
SELECT *, `o_cheque_request.member_id`, `o_cheque_request.wallet_id` FROM `o_cheque_request`, `o_mem
SQL查找是否"存在"，别再count了！
根据某一条件从数据库表中查询『有』与『没有』，只有两种状态，那为什么在写SQL的时候，还要**SELECT count(*)**呢？无论是刚入道的程序员新星，还是精湛沙场多年的程序员老白，都是一如
c# - 存在、读写只需一步
我试图找出一个文件是否存在，如果存在，验证css样式是否已经存在，如果不存在，将它们写在文件末尾... 我已经完成了这一切，但分 3 个步骤: 该文件是否存在？ FileInfo fi= new Fi
android - 如何检测iOS用户或Android用户是否“存在”？
我们正在开发即时消息传递应用程序，并且需要在用户的化身上用绿点显示用户 friend 的“状态”。 “状态”远远超出了“my_app_is_opened_and_on_focus”，这意味着(我猜可能
SQL 查询不存在，存在
模式 Movie(title, year, director, budget, earnings) Actor(stagename, realname, birthyear) ActedIn(stag
MySQL 触发器语法错误 IF 存在
我有一个正在尝试创建的 MySQL 触发器，但无法获得正确的语法。触发器应该遍历一组关键字并将其与插入数据库的新帖子的标题进行匹配。如果找到匹配项，它应该将新帖子分配给该存储桶并更新存储桶的关键字集
MYSQL 选择子查询 IF 存在
我有 3 个表......用户、更新和碰撞。我想向发出 api 请求的用户返回最新订单的 feed 更新，并提供显示 feed 中每个状态所需的所有数据。我还需要包括更新是否已被发出 api 请求的
ios - UIViewController 存在
我正在尝试呈现一个带有 UIView 的 UIViewController。以下是我在 viewDidLoad 方法中尝试的代码。 //create the view controller UIVi
mysql - 如何在一个查询中进行多个计数/存在？
我正在努力弄清楚如何在不对 mysql 进行两次调用的情况下从一个表中检查两件事。我有一个 Members 表。我想测试MemberID 列中是否存在某个值，以及PhoneNumber 列中是否存在
vba - 循环没有 Do 错误但 Do 存在
以下代码给出了一个没有 Do Compile 错误的循环: Loop Sheets("Snap").Rows(1).AutoFilter Field:=5, Criteria1:=List
dns - 域名通过 "dig"存在
是否可以通过检查“dig”的输出来检查域名的存在？在绑定(bind)源中，我发现了这些常量: 0 DNS_R_NOEROR 1 DNS_R_FORMERR 2 DNS_R_SERVFAIL 3 DN
php - Controller 存在，但找不到页面
Controller 有问题我在 Windows 上使用服务器，一切正常，但在互联网上我试图访问页面 social_apartament/beauty_life/并且找不到该页面，代码错误 404这
d - 存在 `static if`时如何生成文档
/** This is struct S. */ struct S(T) { static if(isFloatingPoint!T) { /// This version works
clojure - 类型删除如何帮助 Clojure 存在？
JVM 类型删除如何帮助 Clojure？没有它，Clojure 还能存在吗？如果 JVM 有具体化的类型会发生什么？也就是说，Clojure 将如何改变？最佳答案 Clojure 根本不会有太大变
c - 为什么 system() 存在？
许多论文等提到对“system()”的调用是不安全且不可移植的。我不反对他们的论点。不过，我注意到许多 Unix 实用程序都有一个等效的 C 库。如果没有，源可用于各种这些工具。虽然许多论文和此类
javascript - js如何让一个变量值根据用户登录 Node 存在
在我的 Node js 应用程序中，我有一个用户登录 api。上面我在服务器端代码中创建了一个名为 customerid 的变量。现在，当用户身份验证成功时。我将他的 userid 值存储在我的 cu
azure - 存在 DNS 详细信息时重用资源管理器模板
我有一个工作资源管理器组，由 Ubuntu 14.04 虚拟机、网络接口(interface)、公共(public) IP 地址和存储帐户组成。我已经从这组资源中创建了一个模板。当我尝试部署这组资源
javascript - 存在 javascript 循环引用问题
我有一个函数createminor4(arr，锦标赛)它基本上将arr分成4组，每组8人，然后将它们一次交换到tourney 1组。从那里它插入四个{}，其中有 4 个带有空数组的键。我已经在 Ch
r - 存在 2 个图例时如何更改图例点的大小
我有一个图表，其中有两个图例。我需要更改其中一个图例的点的大小。我需要更改图例中“市场类型”的项目符号大小。我使用示例 here但不适用于我的图表。我的代码如下: k <- ggplot(subs
javascript - 存在 jQuery 字符串比较问题
我有 fiddle here展示我正在尝试做的事情。我有一个动态生成的表，因此列可以按用户选择的任何顺序显示。因此，我尝试获取两个特定 header 的索引，以便可以将 CSS 类添加到这两列以供稍

首页

博学

6Ren·AI

商城

javascript - 使用 javascript 和 AngularJS 检测重写规则后面是否存在资源