从REST获取数据并重定向到另一个页面

时间:2016-06-22 14:36:04

标签: javascript jquery html html5 rest

我正在学习HTML和JavaScript。我被困在一个地方。我的要求是调用REST API并获取值,然后将页面重定向到另一个URL。

代码段:

HTML

<!DOCTYPE html>
<html>
<body>

    //REST SERVICE CALL
    <form action="http://localhost:51349/SMS_Rest.svc/v1/CheckBox"  method="get" > 
        <input type="checkbox" id = "1" name="graphId" value="1"> Graph1<br>
        <input type="checkbox" id = "2" name="graphId" value="2"> Graph2<br>
        <input type="checkbox" id = "3" name="graphId" value="3"> Graph3<br>
        <input type="checkbox" id = "4" name="graphId" value="4"> Graph4<br>
        <input type="submit">
    </form>

</body>
</html>

当我点击提交时,我将REST服务的响应视为TRUE。但是我被重定向到的URL会自动匹配HTML操作字段中提到的REST URL。但我想从REST获取数据,然后将用户重定向到另一个页面。我在这里有道理吗请帮助我。

3 个答案:

答案 0 :(得分:1)

根据您在问题中使用的内容,您使用表单进行REST调用?这不是进行REST调用的常用方法。但是,如果您坚持这样做,则需要更改REST服务的响应以响应重定向,例如:

HTTP/1.1 301 Moved Permanently
Location: http://www.example.org/otherpage

另一种方法是将表单发布到非REST端点上,例如,可以进行表单验证。如果在进行其他客户端验证之前需要调用REST服务,则应在提交表单(window.XMLHttpRequest事件)之前使用onsubmit异步处理REST调用。有关如何实现此目的的更多详细信息:http://rest.elkstein.org/2008/02/using-rest-in-javascript.html

但也许您只需要正常发布您的表单,具体取决于您的用例。但是,将表单提交给REST服务可能不是您想要使用的标准方法。

答案 1 :(得分:1)

我能想到的最佳解决方案是使用AJAX提交表单,然后重定向到您想要的URL:

首先你需要jQuery Form插件 - Ajax Form Plugin 然后在您的表单中添加id =“rest-form”后:

[2016-06-22 16:31:46,451][INFO ][node                     ] [Jonothon Starsmore] version[2.3.2], pid[30390], build[b9e4a6a/2016-04-21T16:03:47Z]
[2016-06-22 16:31:46,462][INFO ][node                     ] [Jonothon Starsmore] initializing ...
log4j:ERROR null
java.io.IOException: Cannot send data to /127.0.0.1:12201
    at biz.paluch.logging.gelf.intern.sender.GelfUDPSender.sendDatagrams(GelfUDPSender.java:59)
    at biz.paluch.logging.gelf.intern.sender.GelfUDPSender.sendMessage(GelfUDPSender.java:49)
    at biz.paluch.logging.gelf.log4j.GelfLogAppender.append(GelfLogAppender.java:95)
    at org.apache.log4j.AppenderSkeleton.doAppend(AppenderSkeleton.java:251)
    at org.apache.log4j.helpers.AppenderAttachableImpl.appendLoopOnAppenders(AppenderAttachableImpl.java:66)
    at org.apache.log4j.Category.callAppenders(Category.java:206)
    at org.apache.log4j.Category.forcedLog(Category.java:391)
    at org.apache.log4j.Category.log(Category.java:856)
    at org.elasticsearch.common.logging.log4j.Log4jESLogger.internalInfo(Log4jESLogger.java:120)
    at org.elasticsearch.common.logging.support.AbstractESLogger.info(AbstractESLogger.java:81)
    at org.elasticsearch.node.Node.<init>(Node.java:151)
    at org.elasticsearch.node.Node.<init>(Node.java:140)
    at org.elasticsearch.node.NodeBuilder.build(NodeBuilder.java:143)
    at org.elasticsearch.bootstrap.Bootstrap.setup(Bootstrap.java:178)
    at org.elasticsearch.bootstrap.Bootstrap.init(Bootstrap.java:270)
    at org.elasticsearch.bootstrap.Elasticsearch.main(Elasticsearch.java:35)
Caused by: java.net.PortUnreachableException
    at sun.nio.ch.DatagramDispatcher.write0(Native Method)
    at sun.nio.ch.DatagramDispatcher.write(DatagramDispatcher.java:51)
    at sun.nio.ch.IOUtil.writeFromNativeBuffer(IOUtil.java:93)
    at sun.nio.ch.IOUtil.write(IOUtil.java:65)
    at sun.nio.ch.DatagramChannelImpl.write(DatagramChannelImpl.java:605)
    at biz.paluch.logging.gelf.intern.sender.GelfUDPSender.sendDatagrams(GelfUDPSender.java:56)
    ... 15 more

答案 2 :(得分:0)

是触发重定向的提交。 我建议你使用AJAX调用,如下所示:

var xhttp = new XMLHttpRequest();
xhttp.open("GET", "http://localhost:51349/SMS_Rest.svc/v1/CheckBox?graphId=" + graphId, true);
xhttp.send();
var response = xhttp.responseText;

获取请求的响应,如果正确的重定向如下:

document.location.href="redirectionTarget";
编辑:本机javascript有点糟糕,你可能想要使用类似jquery的库,正如Leeish所提到的那样。