Question

我有一个使用Spring Boot开发的REST api，它接受POST请求并对它们进行一些处理。然后它会重定向到不同的结果页面。控制器如下：

@RequestMapping(method = RequestMethod.POST, value = "/person")
    public String arrayTest(@RequestParam("personid") String personid, Model model) throws IOException{
        CoreDriver driver=new CoreDriver();
        ResultData result=driver.initProcess(personid);
        model.addAttribute("attr",result.getMismatchList());
        return "results";

    }

在这种情况下，在initProcess函数完成后，它将被重定向到页面：results.html 当我使用表单提交调用服务时，这可以工作，如下所示：

<form id="mainform" method="POST" enctype="multipart/form-data" action="/person">
            <table BORDER="1">
                <tr>
                    <td>Enter person ID</td>
                    <td>
                        <input  type="text" name="personid" id="person">
                    </td>
                </tr>
                <tr>
                    <td><input type="submit" value="submit"/></td>
                </tr>
            </table>
        </form>

但是，当我使用XHR的send函数调用服务时，它成功调用了REST api，但它没有重定向到results.html页面。相反，它给了我一个错误：不支持请求方法'POST'。我的javascript如下：

upload: function(image_data_uri, target_url, callback) {
var http = new XMLHttpRequest();
        http.open("POST", target_url, false);
var form = new FormData();
        var arrayLength = proc_image_data.length;
        for (var j = 0; j < arrayLength; j++) {

        form.append( form_name, proc_data[j], form_name+"."+fmt.replace(/e/, '') );
}

        http.send(form);
    }

使用以下格式调用此JS函数：

<form id="mainform" method="POST" enctype="multipart/form-data" action="">
            <table BORDER="1">

                <tr>
                    <td>Enter person ID</td>
                    <td>
                        <input  type="text" name="personid" id="person">
                    </td>
                </tr>
                <tr>
                    <td><input type="submit" value="submit"  onclick="shot()"/></td>
                </tr>
            </table>
        </form>

function shot() {
        var personId=document.getElementById('person').value;
        var url='/person?personid='+personId;
                Test.upload( webcamuri, url, function(code, text) {

        } );
    }

当我直接从表单调用api而不是通过使用XHR发送的JS时，我不确定为什么重定向有效。你能帮忙在这里找出问题吗？

Answer 1

这是与CORS相关的问题 - 跨源资源共享。为了能够通过XHR访问REST服务，该服务必须向浏览器发送正确的标头（可能正在进行预先请求）。

您可以在REST控制器中通过向@CrossOrigin方法添加arrayTest注释来实现此目的。（见Spring docu）

Answer 2

经过一些调试后我才能解决问题。我从表单中删除了x = data.frame(x1 = c(1,2,3), x2 = c(2,3,4), x3 = c("e","e","e"), x4 = c("f","f","f")) x #x1 x2 x3 x4 #1 2 e f #2 3 e f #3 4 e f x[, c(3,4)] = x[, c(4,3)] #x1 x2 x3 x4 #1 2 f e #2 3 f e #3 4 f e属性，并在method的回调函数中添加了以下代码

Test.upload():

基本上，document.write(text);返回重定向页面的html。因此，一旦text调用完成，html就会通过回调写入浏览器。

使用XHR send调用REST服务后，POST不支持异常

2 个答案: