在 React 样板中获取包装在 request.js 中:如何处理来自 json 主体的 Spring 后端错误
fetch wrapped in request.js in react boilerplate: how to handle error from json body for Spring backend
我正在尝试修改这个文件
https://github.com/mxstbr/react-boilerplate/blob/master/app/utils/request.js
问题是它处理 statusText 中的 errorMessage,这不是我可以从 Spring 后台设置的内容。
我在响应正文中有错误消息。
到目前为止我就是这样解决的
我尝试了很多不同的方法来让它工作,但我总是打破这个提交中实现的逻辑:48eecac任何帮助将不胜感激
import "whatwg-fetch";
import { fromJS } from "immutable";
/**
* Parses the JSON returned by a network request
*
* @param {object} response A response from a network request
*
* @return {object} The parsed JSON from the request
*/
function parseJSON(response) {
return response.json();
}
/**
* Checks if a network request came back fine, and throws an error if not
*
* @param {object} response A response from a network request
*
* @return {object|undefined} Returns either the response, or throws an error
*/
function checkStatus(response) {
if (response.status >= 200 && response.status < 300) {
return response;
}
return response.json().then(throwError);
}
/**
* Throw an error with the errorMessage from the response body
*
* @param errorMessage
*/
function throwError(errorMessage) {
throw new Error(errorMessage);
}
/**
* Requests a URL, returning a promise
*
* @param {string} url The URL we want to request
* @param {object} [options] The options we want to pass to "fetch"
*
* @return {object} An object containing either "data" or "error"
*/
export default function request(url, options = {}) {
return fetch(url, options)
.then(checkStatus)
.then(parseJSON)
.then((response) => (response))
.catch((err) => ({ err }));
}
偶然发现与反应样板相同的问题。
基本上它的工作方式是它使用来自响应的 statusText header 构造错误,而不是响应的 body.
因此,要在不修改样板代码的情况下处理自定义错误消息,您可以直接在服务器端点上的 statusText header 中编写自定义消息,您将响应发送到该端点。
例如在Express(4)中可以这样设置:
res.writeHead(401, 'My custom error message');
return res.send();
然后,在客户端处理该错误的地方,您可以像这样访问此自定义消息:
export function* handleError({ error }) {
console.log(error.message) // will output "My custom error message"
我正在尝试修改这个文件
https://github.com/mxstbr/react-boilerplate/blob/master/app/utils/request.js
问题是它处理 statusText 中的 errorMessage,这不是我可以从 Spring 后台设置的内容。
我在响应正文中有错误消息。
到目前为止我就是这样解决的
我尝试了很多不同的方法来让它工作,但我总是打破这个提交中实现的逻辑:48eecac任何帮助将不胜感激
import "whatwg-fetch";
import { fromJS } from "immutable";
/**
* Parses the JSON returned by a network request
*
* @param {object} response A response from a network request
*
* @return {object} The parsed JSON from the request
*/
function parseJSON(response) {
return response.json();
}
/**
* Checks if a network request came back fine, and throws an error if not
*
* @param {object} response A response from a network request
*
* @return {object|undefined} Returns either the response, or throws an error
*/
function checkStatus(response) {
if (response.status >= 200 && response.status < 300) {
return response;
}
return response.json().then(throwError);
}
/**
* Throw an error with the errorMessage from the response body
*
* @param errorMessage
*/
function throwError(errorMessage) {
throw new Error(errorMessage);
}
/**
* Requests a URL, returning a promise
*
* @param {string} url The URL we want to request
* @param {object} [options] The options we want to pass to "fetch"
*
* @return {object} An object containing either "data" or "error"
*/
export default function request(url, options = {}) {
return fetch(url, options)
.then(checkStatus)
.then(parseJSON)
.then((response) => (response))
.catch((err) => ({ err }));
}
偶然发现与反应样板相同的问题。 基本上它的工作方式是它使用来自响应的 statusText header 构造错误,而不是响应的 body.
因此,要在不修改样板代码的情况下处理自定义错误消息,您可以直接在服务器端点上的 statusText header 中编写自定义消息,您将响应发送到该端点。
例如在Express(4)中可以这样设置:
res.writeHead(401, 'My custom error message');
return res.send();
然后,在客户端处理该错误的地方,您可以像这样访问此自定义消息:
export function* handleError({ error }) {
console.log(error.message) // will output "My custom error message"