[Ruimo.com] The front-end ajax request interface, the back-end interface has actually been accessed, and the data has been successfully inserted into the database. But the front end reported 404

Under normal circumstances, the 404 error reported by the front end means that the interface was not found. But in this case, the backend interface has been successfully executed, but the frontend still reports an error 404. The error is as follows:

But the backend interface is executed normally, and a record has been added to the database

Front-end code:

 this.$http.post("/shop/settledIn",para).then((res) => {
                                if(res.data.success){
                                    this.$message({
                                        message: '操作成功!',
                                        type: 'success'
                                    });
                                    //重置表单
                                    this.$refs['shopForm'].resetFields();
                                    //跳转登录页面
                                    this.$router.push({ path: '/login' });
                                }
                                else{
                                    this.$message({
                                        message: res.data.msg,
                                        type: 'error'
                                    });
                                }
                            });

Backend code:

package com.rk.pethome.controller;
import com.rk.pethome.domain.Shop;
import com.rk.pethome.service.IShopService;
import com.rk.pethome.util.AjaxResult;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
 
@Controller
@RequestMapping("/shop")
public class ShopController {
 
    @Autowired
    private IShopService shopService;
 
    /**
     * 店铺入驻
     * @param shop
     * @return
     */
    @PostMapping("/settledIn")
    public AjaxResult settledIn(@RequestBody Shop shop){
        try {
            shopService.settledIn(shop);
            return new AjaxResult();
        } catch (Exception e) {
            e.printStackTrace();
            return new AjaxResult(false,e.getMessage());
        }
    }
}

It took me a long time to find this error. At first I thought it was a front-end error. In fact, the annotation of the back-end interface was used incorrectly. Here the object is returned instead of the view. The @RestController annotation should be used instead of the @Controller annotation .

The difference between @Controller and @RestController:

@Controller is a view parser, that is, Return returns a view, that is, a jsp or html page.

If you return data json, xml, etc., you need to add @ResponseBody annotation to the corresponding method.

@RestController is a combination of @Controller and @ResponseBody annotations. It is not necessary to add @ResponseBody annotation in front of the method to return json data, but using the @RestController annotation, jsp and html pages cannot be returned, and the view parser cannot parse jsp. html page