Javascript 获取 API PUT 请求

Question

I want to update the book ratings. User will submit rating for a particular book through a form. postRatings is an action creator which is dispatched to component with the form. Books variable contains the same book object as present in the json file. The rating gets updated for the specific book in the Books variable and then I want to delete the older object and put this updated object. But when I try to do this, I get 404: Not Found error message. It would be great if someone can point out where am I mistaking and help me solve this error.

JSON File (Fake Rest API made using json-server Node Module):

{
  "books": [
    {
      "id": "0",
      "title": "1984",
      "author": "George Orwell",
      "rating": "4.6",
      "points: "228",
      "total": "50
    },
    {
      "id": "1",
      "title": "To Kill a Mockingbird",
      "author": "Harper Lee",
      "rating": "4.8",
      "points: "241",
      "total": "50
    }
  ]
}

postRatings Action Creator:

export const postRatings = (Books, title, rating) => (dispatch) => {  
  Books.some(function(obj){
    if(obj.title==title) {
      obj.total = parseInt(obj.total)+1;
        let newPts = parseInt(obj.points) + parseInt(rating);
        obj.points = ""+newPts;
        let newRating = (parseInt(obj.points) + parseInt(rating)) / parseFloat(obj.total);
        obj.ratings = ""+Math.floor(newRating * Math.pow(10, 1)) / Math.pow(10, 1).toFixed(1);
        return true;
    }   
  });
  fetch('localhost:3001/books', {
    method: 'PUT',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(Books)
  })
  .then(response => {
    if(response.ok) {
      return response;
    } else {
        var error = new Error('Error- ' + response.status + ":" + response.statusText);
        error.response = response;
        throw error;
    }
  },
  error => {
    var errmess = new Error(error.message);
    throw errmess;
  })
  .then(response => response.json())
  .then(response => {console.log("response:"+JSON.stringify(response)); alert("Rating Added!")})
  .catch(error => {console.log('Error Message: '+ error.message)
    alert("Some Problem Occurred.\nError: "+error.message);
  });
}

Answer 1

You have to include the id of the object that you want to update. see the default route of json-server

so in your fetch url, add the book id at the end of the route

fetch(`localhost:3001/books/${Books.id}`)