从 HTML 发送 POST 请求作为 json 或 xml 对象

时间:2021-04-13 16:33:02

标签: java json ajax xml forms

我正在尝试根据用户偏好将 HTML 作为 JSON 对象或 XML 对象发送。

我目前有一个 REST API,可以完成 POST 请求并将数据读取为 JSON 或 XML。 (代码如下)。我已经在邮递员中测试了这段代码,并且可以正常工作。

    protected void doPost(HttpServletRequest request, HttpServletResponse response) {
    
    FilmDAO dao = FilmDAO.getInstance();        
    PrintWriter pw = response.getWriter();

    String data = request.getParameter("data");
    String format = request.getParameter("format");
    
    Film f = null;
if (format == null || format.equals("json")) {
    Gson gson = new Gson(); 
    f = gson.fromJson(data, Film.class);
} else if (format.equals("xml")) {
    JAXBContext context;
        context = JAXBContext.newInstance(FilmList.class);
        Unmarshaller unm = context.createUnmarshaller();
        f = (Film) unm.unmarshal(new StringReader(data));
}

    dao.insertFilm(f);
    pw.write("film inserted");
}

我现在正在创建客户端 UI 来替换邮递员,但我不确定如何将输入字段中的数据作为对象发送(我最初尝试将每个项目作为单独的参数发送,但这需要更改为发送为json 或 xml 中的对象)。代码如下。

    <fieldset>
    <legend>Insert film</legend>
    <form>
        <label>title: <input type="text" id="title" /> </label><br />
        <label>year: <input type="text" id="year" /></label><br />
        <label>director: <input type="text" id="director" /></label><br />
        <label>stars: <input type="text" id="stars" /></label><br />
        <label>review:<input type="text" id="review" /> </label><br />
        <label for="data-type3">Server Data Type:</label>
        <select
            id="data-type">
            <option value="xml">XML</option>
            <option value="json" selected="selected">JSON</option>
        </select> <br /> <input type="button" value="Insert Film"
            onclick='insertFilmTable("data-type", "title", "year", "director", "stars", "review", "result-table")' />
    </form>
    <p />
    <div id="result-table"></div>
</fieldset>

这是我尝试更新以使用的两种 ajax 方法

    function ajaxPost(address, data, responseHandler) {
  var request = getRequestObject();
  request.onreadystatechange = 
    function() { responseHandler(request); };
  request.open("POST", address+"?"+data, true);
  request.send(data);
}

function insertFilmTable(formatField, filmname, year, director, stars, review, resultRegion) {
var address = "http://localhost:8080/RestProject/RestAPI";
var format = getValue(formatField);
var filmname = getValue(filmname);
var year = getValue(year);
var director = getValue(director);
var stars = getValue(stars);
var review = getValue(review);
var data = "&format=" + format + "&filmname=" + filmname + "&year=" + year + "&director=" + director + "&stars=" + stars + "&review=" + review;
var responseHandler = findHandler(format);
ajaxPost(address, data,
    function(request) {
        responseHandler(request, resultRegion);
    });

}

0 个答案:

没有答案