Come chiamare API in C# utilizzando angularjs

Question

Ciao sto chiamando il mio API utilizzando il codice qui sotto

$http.get('/api/controller/method?param=value'). 
      then(function (response) { 
       if (response.status == 200) { 
        console.log(response.data); 
       } 
      }); 

Si sta lavorando bene nella mia macchina locale (http://localhost/api/controller/method?param=value).

Ma quando ho schierato in server con nome dell'applicazione app, non è in grado di chiamare l'API (http://server-ip/app/api/controller/method?param=value).

Ovviamente, non lo sarà, in quanto gli URL sono diversi. Quindi qual è il modo corretto per chiamare un'API in C# in modo che funzioni su qualsiasi server.

Quello che ho cercato:
1. URL.Action: Non funziona in questo caso.
2. Non voglio usare @ HTML.hidden
3. Chiamata a partire con o senza barra (/)

Answer 1

non sono sicuro se ho comprensione passa correttamente la vostra domanda, ma sono utilizzando costante angolare per impostare URL server

angular.constant("CONSTS", { 
    "DEV_URL": "http://localhost:12345", 
    "LIVE_URL": "http://server-ip/app" 
}) 

e poi a $ chiamata http

$http.get(CONSTS.DEV_URL + '/api/controller/method?param=value'). 
    then(function (response) { 
     if (response.status == 200) { 
      console.log(response.data); 
     } 
}); 

sono sicuro che c'è un modo per automatizzare questo (gulp, grugnito), ma io didn' t arrivare ancora lì. Quando si distribuisce l'app, cambierei semplicemente la costante manualmente. Se troverò un modo per farlo, aggiornerò la risposta.

Spero che questo aiuti un po '...

Answer 2

Non so processo di generazione, ecc, ma di solito è possibile memorizzare percorso di applicazione in un certo valore costante in angolare e utilizzarlo quando si chiama il vostro API come prefisso.

Se si dispone di una sorta di build automatizzata, è facile preparare pacchetti di distribuzione con valori modificati (utilizzando Gulp/Grunt/TeamCity/Octopus, qualunque cosa si desideri).

Answer 3

Io di solito risolvere questo utilizzando un factory come questo -

Prima nella pagina .cshtml ho caricare tutti i js angolari richiesti. quindi creare una fabbrica per i baseURL come questo -

function(angular){ 
    var module = angular.module('NameOfMyModule'); //gt the module 
    module.factory('BaseUrl', function(){ 
     return '@Url.Action("Action", "Controller")'; 
    }); 
}(window.angular); 

Poi iniettare che BaseURL all'interno del controllore -

.... 
module.controller('SomeController', [...., 'BaseUrl', function(...., BaseUrl){ 
    $scope.baseUrl = BaseUrl; 

}]); 

....` 

Infine anteporre nell'URL

$http.get($scope.baseUrl + /...../).then(....); 

Answer 4

//controller 
 
app.controller("sampleController", function($scope, commonService) { 
 

 
    //post 
 
    $scope.postData = function() { 
 
    var command = {} 
 
    commonService.postSample(command); 
 
    } 
 

 
    //get 
 
    commonService.getSample().then(function(data) { 
 
    $scope.permissionList = data; 
 
    }); 
 

 
}); 
 

 

 

 
//service 
 
app.service('commonService', function($http, $q) { 
 

 
    this.postSample = function(command) { 
 
    var deferred = $q.defer(); 
 
    $http({ 
 
     method: 'POST', 
 
     data: command, 
 
     url: '/Attendance/CreatePersonDailyLeave' 
 
     }) 
 
     .success(function(data) { 
 
     deferred.resolve(data); 
 
     }) 
 
     .error(function(data) { 
 
     deferred.reject(data); 
 
     }); 
 
    return deferred.promise; 
 
    } 
 

 

 
    this.getSample = function(id) { 
 
    var deferred = $q.defer(); 
 
    $http({ 
 
     method: 'GET', 
 
     async: true, 
 
     url: '/Attendance/GetRoles?id=' + id 
 
     }) 
 
     .success(function(data) { 
 
     deferred.resolve(data); 
 
     }) 
 
     .error(function(data) { 
 
     deferred.reject(data); 
 
     }); 
 
    return deferred.promise; 
 
    } 
 

 
});