React 泽西 春季 Tomcat 9 Cors

Question

我有问题，无法弄清楚错误的地方。我有一个简单的React前端，我用来尝试将POST请求发送给我在Tomcat 9服务器上运行的一些REST服务。我已经阅读过，帖子方法需要CORS才能允许来源，我已经从我的应用程序中配置了Web.xml：

    <filter>
    <filter-name>CorsFilter</filter-name>
    <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
    <init-param>
        <param-name>cors.allowed.origins</param-name>
        <param-value>http://localhost:3000</param-value>
    </init-param>
    <init-param>
        <param-name>cors.allowed.methods</param-name>
        <param-value>GET,POST,HEAD,OPTIONS,PUT</param-value>
    </init-param>
    <init-param>
        <param-name>cors.allowed.headers</param-name>
        <param-value>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>
    </init-param>
    <init-param>
        <param-name>cors.exposed.headers</param-name>
        <param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials</param-value>
    </init-param>
    <init-param>
        <param-name>cors.support.credentials</param-name>
        <param-value>true</param-value>
    </init-param>
    <init-param>
        <param-name>cors.preflight.maxage</param-name>
        <param-value>100</param-value>
    </init-param>
</filter>
<filter-mapping>
    <filter-name>CorsFilter</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

我的React代码ID如下：

const payload = {
  username: "Diego",
  password: "PASS"
}
var data = new FormData();
data.append( "json", JSON.stringify( payload ) );
const Prueba = () => {
  fetch(loginurl, {
    method: 'POST',
    headers: {
      "Content-Type": "application/json"
    },
    body: data
  })
  .then(response => response.json())
  .then(jsondata => console.log(jsondata))
  .catch(function(error) {
    console.log(error);
  })
}  

是登录名是以下REST服务的URL

@POST
@Path("/login")
@Consumes(MediaType.APPLICATION_JSON)
@Produces(MediaType.APPLICATION_JSON)
public Response login(User userParam) {
    System.out.println("UserParam.Username: " + userParam.getUsername() + "tUserParam.Password: " + userParam.getPassword());
    User user = this.userLogic.getUserByUsername("diego");
    return Response.status(200).entity(user).build();
} 

如果我使用高级RESTCLIENT CHROME扩展名调用服务，则其效果很好，但是当使用React代码时，服务器抛出以下内容：

Apr 25, 2018 3:00:39 AM org.apache.catalina.core.StandardWrapperValve invoke
SEVERE: Servlet.service() for servlet [jersey-spring] in context with path [/socialmedia] threw exception [org.codehaus.jackson.JsonParseException: Unexpected character ('-' (code 45)) in numeric value: expected digit (0-9) to follow minus sign, for valid numeric value
 at [Source: org.apache.catalina.connector.CoyoteInputStream@5a63d6f9; line: 1, column: 3]] with root cause
org.codehaus.jackson.JsonParseException: Unexpected character ('-' (code 45)) in numeric value: expected digit (0-9) to follow minus sign, for valid numeric value
 at [Source: org.apache.catalina.connector.CoyoteInputStream@5a63d6f9; line: 1, column: 3]
    at org.codehaus.jackson.JsonParser._constructError(JsonParser.java:1432)
    at org.codehaus.jackson.impl.JsonParserMinimalBase._reportError(JsonParserMinimalBase.java:385)
    at org.codehaus.jackson.impl.JsonParserBase.reportUnexpectedNumberChar(JsonParserBase.java:960)
    at org.codehaus.jackson.impl.Utf8StreamParser._handleInvalidNumberStart(Utf8StreamParser.java:2210)
    at org.codehaus.jackson.impl.Utf8StreamParser.parseNumberText(Utf8StreamParser.java:1005)
    at org.codehaus.jackson.impl.Utf8StreamParser._nextTokenNotInObject(Utf8StreamParser.java:598)
    at org.codehaus.jackson.impl.Utf8StreamParser.nextToken(Utf8StreamParser.java:486)
    at org.codehaus.jackson.map.ObjectMapper._initForReading(ObjectMapper.java:2761)
    at org.codehaus.jackson.map.ObjectMapper._readValue(ObjectMapper.java:2682)
    at org.codehaus.jackson.map.ObjectMapper.readValue(ObjectMapper.java:1308)
    at org.codehaus.jackson.jaxrs.JacksonJsonProvider.readFrom(JacksonJsonProvider.java:419)
    at com.sun.jersey.json.impl.provider.entity.JacksonProviderProxy.readFrom(JacksonProviderProxy.java:139)
    at com.sun.jersey.spi.container.ContainerRequest.getEntity(ContainerRequest.java:490)
    at com.sun.jersey.server.impl.model.method.dispatch.EntityParamDispatchProvider$EntityInjectable.getValue(EntityParamDispatchProvider.java:123)
    at com.sun.jersey.server.impl.inject.InjectableValuesProvider.getInjectableValues(InjectableValuesProvider.java:86)
    at com.sun.jersey.server.impl.model.method.dispatch.AbstractResourceMethodDispatchProvider$EntityParamInInvoker.getParams(AbstractResourceMethodDispatchProvider.java:153)
    at com.sun.jersey.server.impl.model.method.dispatch.AbstractResourceMethodDispatchProvider$ResponseOutInvoker._dispatch(AbstractResourceMethodDispatchProvider.java:203)
    at com.sun.jersey.server.impl.model.method.dispatch.ResourceJavaMethodDispatcher.dispatch(ResourceJavaMethodDispatcher.java:75)
    at com.sun.jersey.server.impl.uri.rules.HttpMethodRule.accept(HttpMethodRule.java:302)
    at com.sun.jersey.server.impl.uri.rules.RightHandPathRule.accept(RightHandPathRule.java:147)
    at com.sun.jersey.server.impl.uri.rules.ResourceClassRule.accept(ResourceClassRule.java:108)
    at com.sun.jersey.server.impl.uri.rules.RightHandPathRule.accept(RightHandPathRule.java:147)
    at com.sun.jersey.server.impl.uri.rules.RootResourceClassesRule.accept(RootResourceClassesRule.java:84)
    at com.sun.jersey.server.impl.application.WebApplicationImpl._handleRequest(WebApplicationImpl.java:1542)
    at com.sun.jersey.server.impl.application.WebApplicationImpl._handleRequest(WebApplicationImpl.java:1473)
    at com.sun.jersey.server.impl.application.WebApplicationImpl.handleRequest(WebApplicationImpl.java:1419)
    at com.sun.jersey.server.impl.application.WebApplicationImpl.handleRequest(WebApplicationImpl.java:1409)
    at com.sun.jersey.spi.container.servlet.WebComponent.service(WebComponent.java:409)
    at com.sun.jersey.spi.container.servlet.ServletContainer.service(ServletContainer.java:558)
    at com.sun.jersey.spi.container.servlet.ServletContainer.service(ServletContainer.java:733)
    at javax.servlet.http.HttpServlet.service(HttpServlet.java:741)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:231)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:166)
    at org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:53)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:193)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:166)
    at org.apache.catalina.filters.CorsFilter.handleSimpleCORS(CorsFilter.java:301)
    at org.apache.catalina.filters.CorsFilter.doFilter(CorsFilter.java:161)
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:193)
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:166)
    at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:199)
    at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:96)
    at org.apache.catalina.authenticator.AuthenticatorBase.invoke(AuthenticatorBase.java:494)
    at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:137)
    at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:92)
    at org.apache.catalina.valves.AbstractAccessLogValve.invoke(AbstractAccessLogValve.java:651)
    at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:87)
    at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:343)
    at org.apache.coyote.http11.Http11Processor.service(Http11Processor.java:407)
    at org.apache.coyote.AbstractProcessorLight.process(AbstractProcessorLight.java:66)
    at org.apache.coyote.AbstractProtocol$ConnectionHandler.process(AbstractProtocol.java:754)
    at org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.doRun(NioEndpoint.java:1376)
    at org.apache.tomcat.util.net.SocketProcessorBase.run(SocketProcessorBase.java:49)
    at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1149)
    at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:624)
    at org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:61)
    at java.lang.Thread.run(Thread.java:748)

更新：chrome的有效载荷

------WebKitFormBoundaryZv1Ml2SgmeIwrn21
Content-Disposition: form-data; name="json"
{"username":"Diego","password":"PASS"}
------WebKitFormBoundaryZv1Ml2SgmeIwrn21--

有什么想法可能是什么问题？感谢您的帮助！！迭戈

Answer 1

错误的原因是请求编码为 FormData。

而不是使用new FormData()和append。

只使用JSON.stringify。

var data = JSON.stringify( payload );
const Prueba = () => {
  fetch(loginurl, {
    method: 'POST',
    headers: {
      "Content-Type": "application/json"
    },
    body: data
  })
  .then(response => response.json())
  .then(jsondata => console.log(jsondata))
  .catch(function(error) {
    console.log(error);
  })
}  

如果您正在开发复杂的应用程序，我建议Axios。