javascript - Java REST 调用与 Web 应用程序的前端有何关系？

Question

我知道 REST 调用如何在 Java Web 应用程序中工作。例如。当到达 URL 时，将使用 HTTP 调用其方法。

例如:

 @GET
    @Path("people/{id}")
    public Response getPersonWithId(@PathParam("id") id) {

      //return the person object with that Id

    }

我不确定的是它如何链接到前端？

UI(即 javascript)的作用是否只是将用户带到特定的 URL 以便调用后端方法？

例如如果用户按下“获取详细信息”按钮，该按钮是否只是将他们重定向到处理返回详细信息的 URL，然后调用后端功能？

Answer 1

WebService实际上并没有像webapp一样链接或绑定(bind)到前端。相反，webservice 是一种根据请求类型(get、post、update、delete)以 JSON/XML、纯文本格式提供结果的服务，因此，该服务可以被任何多个前端应用程序使用(不仅Web 应用程序以及智能手机应用程序、桌面应用程序等)。此外，网络服务可以位于完全不同的服务器上。

让我给你一个场景:

Suppose, you have an front end web site ABC-Website and a backend webservice on host: www.xyzservice.com/api with following methods:

/product - get request that return all product as list in json format.

/product/id - get request return product detail given id in json format.

现在，如果您只需在浏览器中输入 www.xyzservice.com/api/product 然后 所有产品列表将以 json 格式显示在浏览器中。这意味着，您还可以在没有前端系统的情况下直接在浏览器中从 web 服务读取数据，即 web 服务不链接/绑定(bind)到任何前端。

现在，您想在您的 ABC 网站中使用此网络服务来显示所有产品列表:

You call www.xyzservice.com/api/products and get JSON object that you can use to display in your html page.

<button type="button" onclick="getProducts()">Click Me!</button> 

function getProducts(){ 
$.ajax({
        type : "GET",
        contentType : "application/json",
        url : "http://www.xyzservice.com/api/product",
        dataType : 'json',
        timeout : 100000,
        success : function(data) {
            // now you have "data" which is in json format-same data that is displayed on browser.
            displayDate(date);      
        },
        error : function(e) {
            //do something
        },
        done : function(e) {
            //do something
        }
    });
}

function displayDate(){
    //your codes to parse and display json data  in html table in your page.
}