如何使用AngularJS在IIS上不使用＃重写URL？

Question

I've used an URL rewrite in my web.config that will allow me to add URLs that do not include a # and allow me to view URL's such as http://somewebsite.com/name using "name" as a parameter to retrieve a template file. When I use this param with an XMLHTTPRequest the pages always return a 200 response because all URLs are essentially validated by the web.config rewrite. Is there a way that I can create routes in Angular that will return the correct template whether or not a file exists and if not return a custom 404 page? As it is on my home page of my website I include a template file which displays a header ng-view and then a footer. When I view a page such as http://somewebsite.com/random and random does not correspond to a page the home page will continue to load without displaying a 404 page. The page will continue to load without ceasing.

========== web.config settings ==============

<system.webServer>
<rewrite>
  <rules>
    <rule name="AngularJS Routes" stopProcessing="true">
      <match url=".*" />
      <conditions logicalGrouping="MatchAll">
        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
        <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
      </conditions>
      <action type="Rewrite" url="/" />
    </rule>
  </rules>
</rewrite>

======= Angular Route settings ===============

angular.module('main').config(['$routeProvider', '$locationProvider',
function($routeProvider, $locationProvider)
{
    //we cannot use services or factories so using the anguar $http provider is
    //out of question. Instead we will use a legacy HTTP AJAX request and return
    //the status of the said page. 

    var checkUrlStatus = function(url){
        console.log(url + '.asp');
        var http = new XMLHttpRequest();
        http.open('GET', url, false);
        http.send();
        console.log(http.status);
        return (http.status !== 404 ? url : 'https://somewebsite.com/404.asp');
    }


    //removes the hash from the urls, but must be used in conjunction with
    //the web.config or apache config file
    if(window.history && window.history.pushState){
    $locationProvider.html5Mode({
        enabled: true, 
       requireBase: false 
     });
         }
    //conditions to route page to the correct template. See if the template 
    //returns the right resonse with the checkUrl function and proceed forward. 
 $routeProvider.when('/:param',{

         templateUrl: function(params){
                //return checkUrlStatus('https://somewebsite.com/pages/accounting.asp');    
             console.log(checkUrlStatus('https://somewebsite.com/pages/bob.asp')    );
            //return "/pages/"+url_param+".asp"; 
         }
     }).when('/',{
     templateUrl: function(){
         return 'home.asp';
     }

 }).otherwise({
     templateUrl: function(){
         return 'home.asp';

     }
 })     

}   

]);

Answer 1

The problem is that I can make a request to a page however, the page will always return a 200 because the URL rewrite is returning / or the home page of my app. So instead I created a tag "is-content" as the first class on my page and when there was an AJAX request for this page I looked for this class. If it existed I displayed the contents of the template or else I displayed the content for my custom 404 page. Below is an example of the function used to test this:

var checkUrlStatus = function(url){
        var http = new XMLHttpRequest();
        http.open('GET', url, false);
        http.send();
        var responseText = http.responseText; 
        var htmlObject = document.createElement('div');
        htmlObject.innerHTML = responseText; 
        var htmlReturn = htmlObject;
        if ( htmlReturn.getElementsByClassName('is-content').length > 0){
            return url; 
        }
        else { 
            return 'https://testwebsite.com/pages/404.asp'; 
        }


    }