gpt4 book ai didi

javascript - 不加载特定路径的 JS 文件

转载 作者:数据小太阳 更新时间:2023-10-29 06:09:46 24 4
gpt4 key购买 nike

我有一个网站 mean-stack

通常,我所有的外部引用都列在 index.html

我意识到我正在使用的一个外部 JS 库(例如 https://cdnjs.cloudflare.com/troublelibrary.js)与我网站的一部分有一些冲突。所以我正在寻找的解决方法是不为特定路径加载它 https://www.myexample.com/specific

有谁知道如何在路由中实现这一点?

编辑 1:(查看完整问题 here)

实际上,有冲突的库是history.js。我一直加载它的初始代码如下。结果 https://localhost:3000/home 在浏览器中总是 https://localhost:3000/home (即不会添加 # 因为 history.js)

<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script>
<script src="https://cdn.rawgit.com/devote/HTML5-History-API/master/history.js"></script>

然后,如果我按照 Ben 的建议尝试以下代码:

<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script>
<script>
var newScript = document.createElement('script');
newScript.src = 'https://cdn.rawgit.com/devote/HTML5-History-API/master/history.js';
document.head.appendChild(newScript);
console.log(window.location.href)
</script>

我意识到第一次加载https://localhost:3000/home不会改变。但是,如果我刷新浏览器,它可以更改为 https://localhost:3000/#/home

所以附加脚本与直接引用并不完全相同,有人知道为什么吗?

最佳答案

我从不同的 Angular 看待您的问题。您提到您使用 history.js 来避免 URL 上的 #。但是您不需要 history.js 来做到这一点。我认为您以错误的方式理解了您的问题。有一个内置的 Angular 功能可以摆脱 # 路径。因为 # 用于跟踪任何路由上的相对路径。如果我们愿意,我们可以覆盖该默认功能。

但是如果你使用这种方法,服务器应该负责将用户重定向到任何应用程序 route 上的 indexhome 页面,因为 Angular handle应用程序中的所有路由。

首先你应该添加

<base href="/" /> 

在您的 HTML 文件中。

然后您应该在 Angular 应用程序中启用 HTML5 模式,如下所示。

$locationProvider.html5Mode(true);

通过添加这两个属性,您可以摆脱 # 路径,这是推荐的方式。

下面是一个完整的例子。

var app = angular.module("app", ["ngRoute"]);


app.controller("MainController", function($scope){
});


//Add route handler
app.config(["$routeProvider", "$locationProvider", function ($routeProvider, $locationProvider) {

$routeProvider
.when('/', {
template: '<h1>Home</h1>',
reloadOnSearch: true
})
.when('/about', {
template: '<h1>About</h1>',
reloadOnSearch: true
}).otherwise({
redirectTo: '/'
});

// This will remove hash bang from the routes
$locationProvider.html5Mode(true);

}]);
<html>

<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.10/angular-route.js"></script>

<base href="/" />

</head>

<body>

<div>
<a href="/">Home</a>
<a href="/about">About</a>
</div>

<div ng-app="app" ng-controller="MainController">
<ng-view></ng-view>
</div>

</body>

</html>

正如您在上面的示例中看到的,当您单击 about 链接时,服务器会在 /about 上响应 not found。这意味着 # 爆炸已被删除。

关于javascript - 不加载特定路径的 JS 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46249588/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com