Http requests multi browser troubles

It's tough to gauge from the parameters you posted, but just based on you saying that this works perfectly in Safari, but doesn't work in Chrome or Firefox, it sounds like this could be a CORS issue.

Firefox and Chrome have different requirements for cross-origin requests than Safari. Is your Laravel api endpoint for this destroy action located at the same location as your Angular app? What Access-Control-Allow-Origin header is the API returning?

Try adding something like the following to Laravel and see if it makes it this block consistent across those browsers:

App::before(function($request) {  // Enable CORS   // In production, replace * with http://yourdomain.com   header("Access-Control-Allow-Origin: *");  header('Access-Control-Allow-Credentials: true');  if (Request::getMethod() == "OPTIONS") {    // The client-side application can set only headers allowed in Access-Control-Allow-Headers    $headers = [      'Access-Control-Allow-Methods' => 'POST, GET, OPTIONS, PUT, DELETE',      'Access-Control-Allow-Headers' => 'X-Requested-With, Content-Type, X-Auth-Token, Origin, Authorization'    ];    return Response::make('You are connected to the API', 200, $headers);  }});

(^ source)

I guess its a CORS issue. And moreover this issue normally happens if you decouple your client side from your server side. You need to create a before middleware to handle such issues.

namespace App\Http\Middleware;use Closure;class BeforeMiddleware{  /**  * Handle an incoming request.  *  * @param  \Illuminate\Http\Request  $request  * @param  \Closure  $next  * @return mixed  */ public function handle($request, Closure $next) {    /**     * The access control allow origin and     * allow credential is set to * and true     * because i allow request from different domains    * to hit the server    */    header('Access-Control-Allow-Origin: *');    header('Access-Control-Allow-Credentials: false');    header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS');    header('Access-Control-Allow-Headers: Origin, Content-Type, Accept, Authorization');    if ($request->getMethod() == "OPTIONS") {        $headers = array(            'Access-Control-Allow-Methods'=> 'POST, GET, OPTIONS, PUT, DELETE',            'Access-Control-Allow-Headers'=> 'X-Requested-With, content-type',);        return Response::make('', 200, $headers);    }    return $next($request); }}

And at the angular side of things add this config block

app.config(['$httpProvider', function ($httpProvider) {  $httpProvider.defaults.useXDomain = false;  $httpProvider.defaults.withCredentials = false;  delete $httpProvider.defaults.headers.common['X-Requested-With'];}]);

If you return a value in the successCallback or errorCallback, the returned value will be used to resolve the promise.Try to define a $q.deferred that will be resolved on get $http sucess with the data.

$scope.deleteOpportunity = function() {            var deferred = $q.defer();            UBOService.destroy($scope.activeItem.id)                .then(function successCallback(response) {                    UBOService.get().then(function(response){                        $scope.opportunities = response.data;                        deferred.resolve(response.data);                    };                }, function errorCallback(response) {                    $scope.error = response;                });        return deferred.promise;}