在Visual Studio中使用asp.net获取AngularJs模式的406不可接受的错误

时间:2018-03-29 16:46:42

标签: angularjs asp.net-mvc visual-studio iis-express

在尝试使用AngularJS和bootstrap(uibModal)模拟显示html页面时尝试运行406错误后,我发现错误仅限于我使用的三台计算机中的一台计算机,让我相信问题必须是问题机器上的配置。我无法弄清问题在哪里。每台计算机都使用Visual Studio 2015,其中包含项目的精确副本,直到所有依赖项,在调试期间使用IISExpress。我在这里创建了演示版本并确认了相同的行为 - 在两个上工作,在一个上失败。希望有人至少能让我朝着正确的方向前进。我已经尝试过查看IIS Express的设置是否存在差异,但我没有看到任何跳出来的内容。

我从基本的AspNet MVC项目开始。这是_Layouts.cshtml页面:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body ng-app="app">
    <div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                @Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li>@Html.ActionLink("Home", "Index", "Home")</li>
                    <li>@Html.ActionLink("About", "About", "Home")</li>
                    <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
                </ul>
            </div>
        </div>
    </div>
    <div class="container body-content">
        @RenderBody()
        <hr />
        <footer>
            <p>&copy; @DateTime.Now.Year - My ASP.NET Application</p>
        </footer>
    </div>
@Scripts.Render("~/bundles/app");
@Scripts.Render("~/bundles/bootstrap");
@RenderSection("scripts", required: false);
@Scripts.Render("~/bundles/controllers");
@Scripts.Render("~/bundles/jquery");
</body>
</html>

这是Index.cshtml页面:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="..\Content\bootstrap.css" type="text/css" media="all" />
    <link rel="stylesheet" href="..\Content\default.css" type="text/css" media="all" />
    <link rel="stylesheet" href="..\Content\site.css" type="text/css" media="all" />
</head>
<body>
<div class="modal-dialog" data-backdrop="false" style="z-index: 1100;">
    <!--<div class="modal fade" id="createModal" data-backdrop="false" style="z-index: 1100;">-->
    <h1>Terms and Conditions</h1>
    <p>Last updated: February 25, 2018</p>
    <p>
        Please read these Terms and Conditions ("Terms", "Terms and Conditions") carefully before using the website (the "Service") operated by My Fake Company ("us", "we", or "our").
        Your access to and use of the Service is conditioned upon your acceptance of and compliance with these Terms. These Terms apply to all visitors, users and others who wish to access or use the Service.
        By accessing or using the Service you agree to be bound by these Terms. If you disagree with any part of the terms then you do not have permission to access the Service.
    </p>
</div>
</body>
</html> 

这是AngularJS模块:

var app = angular.module('app', ['ngRoute','ui.bootstrap', 'ngMessages']);

var serviceBase = 'http://localhost:46497/';
app.constant('ngAuthSettings', {
    apiServiceBaseUri: serviceBase,
    clientId: 'ngAuthApp'
});

app.config(function ($httpProvider) {
    $httpProvider.interceptors.push('authInterceptorService');
});

这是拦截器(它似乎没有涉及到这个问题,因为在调用模态后它没有被击中,但完全披露):

'use strict';
app.factory('authInterceptorService', ['$q',  function ($q) {

    var authInterceptorServiceFactory = {};

    var request = function (config) {
        var contentType = config.headers["Content-Type"];
        config.headers = config.headers || {};
    config.headers = {};

        if (config.headers.Accept != null)
            config.headers.Accept = null;
        if (contentType !== '' && typeof contentType !== 'undefined')
            config.headers["Content-Type"] = contentType;
        return config;
    }


    authInterceptorServiceFactory.request = request;

    return authInterceptorServiceFactory;
}]);

这是我的AngularJS控制器:

'use strict';
var app = angular.module('app');
app.controller('createAccountCtrl', ['$scope', '$window', '$timeout', '$uibModal', function ($scope, $window, $timeout, $uibModal) {
    var vm = $scope;

    vm.viewTerms = function () {
        $uibModal.open({
            templateUrl: '/termsAndConditions.html',
            backdrop: false,
            windowClass: 'modal',
            controller: function (
            $uibModalInstance) {
                vm.close = function () {
                    $uibModalInstance.close('cancel');
                };
            }

        });
    }

}]);

提前感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

我通过构建一个新项目解决了这个问题。我将代码复制到新项目中。我怀疑csproj文件或applicationHost.config(IISExpress)中的某个地方已被破坏,我没有看到它。我能找到的唯一的物理差异是,坏的csproj引用了TypeScript 2.2,我认为我已经删除但看起来像NuGet正在放回去。我没有使用打字稿(angularJs 1.X),所以它确实脱颖而出。新版本有效,这是主要问题。