如果在使用ajax時條件無效，如何重定向到另一個頁面？

我想通過 ajax 將產品添加到購物車。只有登錄用戶才能向該用戶添加產品。如果用戶未登錄，則將他重定向到登錄頁面

這是我在刀片模板中的 ajax 請求

    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    function addedToCart(){
        var product = $("#productId").val();;
        var val = $("#countItem").val();
        var unit = parseInt(val);
        $.ajax({
            type: "POST",
            url: "/addtocart",
            data: {product: product, unit: unit},
            dataType: "json",
            success: function (res){
                alertMsg.fire({
                    title: 'Product added to Cart'
           })
            }
        });
    }
     `

這里是控制器代碼

function addToCart(Request $req){
    if($req->session()->has('user')){
        $cart = new Cart;
        $cart->user_id = $req->session()->get('user')['id'];
        $cart->product_id = $req->product;
        $cart->unit = $req->unit;
        $cart->save();
        return response($cart, 201);
    }
    
    else{
        return redirect('/login');
    }
    
}

它不能去登錄路線仍然停留在同一頁面

uj5u.com熱心網友回復：

Ajax 請求需要 JSON 陣列文字，例如 JSON 格式的陣列/物件和純字串作為回應。意思是，您不能在 PHP 中回傳重定向物件。

你可以

// in controller
if (!$req->session()->has('user')) {
    return response()->json([
        'error' => "Forbidden"
    ], 403);
}

// save the cart and return success object

然后

// in JS
$.ajax({
    type: "POST",
    url: "/addtocart",
    data: {product: product, unit: unit},
    dataType: "json",
    success: function (res){
        alertMsg.fire({
            title: 'Product added to Cart'
        })
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) { 
        window.location = 'path_for_guests'// this path should be returned from backend for greater security 
    } 
});

另外，請注意未保存的物件。例如，如果$cart未成功保存，則不應回傳成功訊息。你的代碼現在在做什么。要遵循Object Calisthenics適當的代碼（其他代碼太多），您可以使用switch并在適當的情況下匹配各種例外和期望，例如

• 用戶會話不存在 403
• 物件未創建 500
• 購物車已創建 201
• 等等

uj5u.com熱心網友回復：

在 JSON 回應中，您不能在服務器端使用重定向。

要么你可以在這里玩狀態，比如用戶是否登錄，然后執行你的操作，否則回傳一個回應status: false。

我在下面修改了您的代碼鏈接，并在評論中添加了我所做的更改。

你的 JS 代碼

$.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
});

function addedToCart(){
    var product = $("#productId").val();;
    var val = $("#countItem").val();
    var unit = parseInt(val);
    $.ajax({
        type: "POST",
        url: "/addtocart",
        data: {product: product, unit: unit},
        dataType: "json",
        success: function (response){
            if (response.status) { // if it is true
                alertMsg.fire({
                    title: 'Product added to Cart',
                });
            } else {
                // if it is false, redirect
                window.location.href = response.redirect_uri;
            }
        },
    });
}

您的控制器功能：

function addToCart(Request $request){
    if($req->session()->has('user')){
        $cart = new Cart;
        $cart->user_id = $request->session()->get('user')['id'];
        $cart->product_id = $request->product;
        $cart->unit = $request->unit;
        $cart->save();
        return response($cart, 201);
    }
    else{
        // you can return with status flag, and using the redirect_uri your can redirect at your desire page.
        return response()->json(array(
            'status' => false,
            'redirect_uri' => route('login'),
        ), 401);
    }
    
}

不確定，關于您將在 AJAX 中獲得的錯誤狀態success()，如果您不會獲得，那么您將不得不error在success(). 因為我們在回應中傳遞標頭狀態。

error: function (error) {
    // do console log to check what you get
}

標籤：

上一篇：如何使用Breeze在Laravel8中自定義注銷？

下一篇：合并到一個查詢兩個不同