在Java Web Service中启用CORS

时间:2019-01-17 15:56:41

标签: java reactjs web-services cors

注意:我已经想出了解决方案。我只是发布问题和解决方案,以防其他人遇到类似问题

长话短说:

当我有一个REACT客户端应用程序向从NetBeans运行的Payara服务器上运行的Java Web Server进行HTTP发布时,我在浏览器的“开发人员工具”窗口中收到此CORS错误消息:

  

SEC7120:[CORS]找不到源“ http://localhost:3000”   Access-Control-Allow-Origin响应中的“ http://localhost:3000”   跨域资源的标头位于   'http://localhost:8080/DatabaseWebService/databaseConnectorMethod'。

有关CORS的更多信息,请访问此网站https://enable-cors.org/

详细内容:

我有一个运行在http://localhost:3000上的REACT项目,向我拥有的Java Web Service(DatabaseWebService)进行了HTTP发布,该Java Web Service在本地Payara Server版本4.1.1上运行。 REACT应用程序请求的Web服务URL是“ http://localhost:8080/DatabaseWebService/databaseConnectorMethod

每次我运行REACT代码时,都会收到上面列出的CORS错误。

这是我的REACT代码,发出http发布请求:

            const postData = new URLSearchParams();
            postData.append('var1', 'somedata1');
            postData.append('var2', 'somedata2');
            let axiosConfig = {
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded'                
}
            };

        axios.post('http://localhost:8080/DatabaseWebService/databaseConnectorMethod', postData, axiosConfig)
            .then((res) => {
                console.log("AXIOS POST RESPONSE RECEIVED: ", res);
            })
            .catch((err) => {
                console.log("AXIOS POST ERROR: ", err);
            })

这是我的servlet代码:

public class DatabaseConnectorServlet extends HttpServlet {
        @Override
        final protected void doPost(final HttpServletRequest request, final HttpServletResponse response)
                throws ServletException, IOException {

            try {
                System.out.println("DatabaseConnectorServlet Received a HTTP POST");  

                String var1= request.getParameter("var1");
                String var2= request.getParameter("var2");
                System.out.println(var1 + var2);
                response.getWriter().print("I GOT YOUR MESSAGE");
            } catch (Exception ex) {                          
                response.getWriter().print(ex);
            }
        }

我在上面的Java代码中添加了断点,看到断点被击中,并且看到它执行了所有命令,包括response.getWriter()。print都没有问题。但是,当我查看浏览器开发人员工具的“控制台”窗口时,确实看到了CORS异常。

1 个答案:

答案 0 :(得分:0)

解决方案 在Java Web Service应用程序中,您需要添加一些标头以允许在Response对象中使用CORS。这是更新的Java代码,请注意额外的response.addHeader行代码:

public class DatabaseConnectorServlet extends HttpServlet {

    @Override
    final protected void doPost(final HttpServletRequest request, final HttpServletResponse response)
            throws ServletException, IOException {

        try {
            System.out.println("DatabaseConnectorServlet Received a HTTP POST");
            response.addHeader("Access-Control-Allow-Origin", "http://localhost:3000"); //Here's the extra line needed to allow CORS to your server side code

            String var1 = request.getParameter("var1");
            String var2 = request.getParameter("var2");
            System.out.println(var1 + var2);
            response.getWriter().print("I GOT YOUR MESSAGE");

        } catch (Exception ex) {
                response.addHeader("Access-Control-Allow-Origin", "http://localhost:3000");
            response.getWriter().print(ex);
        }
    }

有了此更新的代码,我现在可以在运行React代码的Web浏览器开发者工具的控制台窗口上看到示例“ I GOT YOUR MESSAGE”文本。

这基本上允许来自其他域/端口(即本例中的REACT应用程序)的http请求访问此Java Web服务中的数据。

也让您知道,您可以包括一些其他标题(我在其他问题上看到),这些标题对于我的情况不是必需的,但可能对您有用。以下是其他标题和一些示例值:

 response.addHeader("Access-Control-Allow-Origin", "http://localhost:3000");
        response.addHeader("Access-Control-Allow-Headers", "Origin, Content-Type, Accept, X-Auth-Token");
        response.addHeader("Access-Control-Allow-Credentials", "true");
        response.addHeader("Access-Control-Request-Headers", "Origin, X-Custom-Header, X-Requested-With, Authorization, Content-Type, Accept");
        response.addHeader("Access-Control-Expose-Headers", "Content-Length, X-Kuma-Revision");
        response.addHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, PATCH, OPTIONS");