【问题标题】:Trying to store an object on an array on a server using spring boot尝试使用spring boot将对象存储在服务器上的数组中
【发布时间】:2021-03-12 12:26:25
【问题描述】:

我正在做一个学校项目,用 Spring Boot 将对象存储在服务器上的数组中,但它不起作用,我可以找出代码有什么问题。该站点假设重新发布一个站点来购买电影票并存储/显示 html 文档上的信息。您可以一键删除数组中存储的每个对象。当我尝试存储对象时,什么也没有发生,spring 也没有发送任何内容。

$(() => {
    $("#kjop").click (() => {
        const film = $("#film");
        const antall = $("#antall")
        const fornavn = $("#forNavn");
        const etternavn = $("#etterNavn");
        const telefon = $("#telefornr");
        const epost = $("#epost");

        const billett = {
            film: film.val(),
            antall: antall.val(),
            fornavn: fornavn.val(),
            etternavn: etternavn.val(),
            telefon: telefon.val(),
            epost: epost.val(),
        };

        if (validering(billett)) {
            $.post("/billett", billett, () => hent());


            film.val("");
            antall.val("");
            fornavn.val("");
            etternavn.val("");
            telefon.val("");
            epost.val("");
        } else {
            console.log("Mangler input");
        }
    });

        $("#slettBilett").click(() => {
            $.ajax("/billett", {
                type: "DELETE",
                success: () => hent(),
                error: (jqXhr, textStatus, errorMessage) => console.log(errorMessage)
            });
        });
    });

const hent = () => $.get("/billett", billett => utskrift (billett));

const validering = billett => {
    if (billett.film === "") return false
    else if (billett.antall ==="") return false
    else if (billett.fornavn === "") return false
    else if (Billett.etternavn === "") return false
    else if (billett.telefon === "") return false
    else return billett.epost !== "";
}



const utskrift = billett => {
    let ut = "<table><tr>" +
        "<th>Film</th><th>antall</th><th>Navn</th><th>Etternavn</th><th>Telefonnr</th><th>Epost</th>" +
        "</tr>";
    for (let b of billett) {
        ut += "<tr>";
        ut += "<td>" + b.film + "</td><td>" + b.antall + "</td><td>" + b.navn + "</td><td>" + b.etternavn + "</td><td>" + b.tlf + "</td><td>" + b.epost + "</td>";
        ut += "</tr>";
    }
    ut += "</table>";
    $("#bestilt").html(ut);
}
package com.example.demo;

import com.example.demo.billett;
import com.example.demo.AppRepository;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

import java.util.ArrayList;
@RestController
@RequestMapping("/api/lagringserver/")
public class Controller {
    @Autowired
    AppRepository repo;

    @PostMapping("/billett")
    public void lagre(billett billett) {
                repo.leggInn(billett);
            }

    @GetMapping("/billett")
    public ArrayList<billett> hent() {

        return repo.hentAlle();
    }

    @DeleteMapping("/billett")
    public void slett() {
        repo.slettBilett();
    }
}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Oblig 1</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="index.js"></script>

</head>

<body>

<h1>Bestilling av kinobiletter</h1>

<div>
    Velg film:
    <select id="film">
        <option value="non">Velg film her</option>
        <option>Iron man</option>
        <option>Troya</option>
        <option>Avengers</option>
        <option>The green mile</option>
        <option>God father</option>
        <option>Fight club</option>
    </select><span id="valgterr" style = "color:#ff0000"></span>
</div>

<br /><br />

<div>
    Antall <input type="text" id="antall" /><span id="antallerr" style = "color:red"> </span>
</div>

<br /><br />

<table>

    <tr>
        <td>Fornavn</td><td> <input type="text" id="forNavn" /> </td><td><span id="forNavnerr" style = "color:red"> </span></td>
    </tr>
    <tr>
        <td>Etternavn</td><td> <input type="text" id="etterNavn"/> </td><td><span id="etterNavnerr" style = "color:red"> </span></td>
    </tr>
    <tr>
        <td>Telefonnr</td><td> <input type="text" id="telefornr"/> </td><td><span id="tlferr" style = "color:red"> </span></td>
    </tr>
    <tr>
        <td>Epost</td><td> <input type="text" id="epost"/> </td><td><span id="eposterr" style = "color:red"> </span></td>
    </tr>


</table>

<button id="kjop();">Kjøp Billet</button>

<br /><br />

<h2>
    Alle Billetter
</h2>
<div id="bestilt">
</div>
<br /><br />
<button id="slettBilett();">Slett alle billetter</button>

</body>
</html>

package com.example.demo;

public class billett {
    private String film;
    private String antall;
    private String fornavn;
    private String etternavn;
    private String telefon;
    private String epost;

        public billett (String film, String antall, String fornavn, String etternavn, String telefon, String epost) {
            this.film = film;
            this.antall= antall;
            this.fornavn = fornavn;
            this.etternavn = etternavn;
            this.telefon = telefon;
            this.epost = epost;
        }

        public String getFilm() {

            return film;
        }

        public void setFilm(String film){

            this.film = film;
        }
        public String getAntall(){

            return antall;
        }

        public void setAntall(String fornavn){

            this.antall = antall;
        }

        public String getFornavn(){

            return fornavn;
        }

        public void setFornavn(String fornavn){

            this.fornavn = fornavn;
        }
        public String getEtternavn(){

            return etternavn;
        }

        public void setEtternavn (String etternavn){
            this.etternavn = etternavn;
        }
        public String getTelefon(){
            return telefon;
        }

        public void setTelefon (String telefon){
            this.telefon = telefon;
        }
        public String getEpost(){
            return epost;
        }

        public void setEpost (String epost){
            this.epost = epost;
        }

    }
package com.example.demo;

import com.example.demo.billett;
import org.springframework.stereotype.Repository;

import java.util.ArrayList;

@Repository
public class AppRepository {
    private final ArrayList<billett> billettliste = new ArrayList<>();

    public void leggInn(billett billett) {
        billettliste.add(billett);
    }

    public ArrayList<billett> hentAlle () {
        return billettliste;
    }

    public void slettBilett() {
        billettliste.clear();
    }
}

【问题讨论】:

  • “当我尝试存储对象时,什么也没有发生,spring 也没有发送任何内容”。你怎么会知道这事?您是否看到浏览器控制台以查看请求是否正在发送到服务器?您是否启用了 Spring 调试以查看它是否正在接收请求?服务器是响应错误还是根本没有响应?
  • 控制台未显示任何错误,网络未显示任何正在发送的内容
  • 我有一个 heroku 链接,我已将所有内容上传到 github skoleoblig2.herokuapp.com

标签: javascript html jquery spring spring-boot


【解决方案1】:

我看到您正在使用 arraylist 来存储数据,但是请记住,一旦您重新启动应用程序,这些数据就会消失。我假设您想使用数据库。 Spring 为您提供了一个简单的解决方案(spring-data-jpa),它将您从样板代码中抽象出来,让您可以毫无问题地更改数据库。 首先选择要存储数据的数据库。 https://dzone.com/articles/using-mysql-jdbc-driver-with-spring-boot

然后就可以创建仓库了

package com.example.demo;

import com.example.demo.billett;
import org.springframework.stereotype.Repository;

import java.util.ArrayList;

@Repository
public interface AppRepository extends CrudRepository<Billett, Long>{
}

在后台,在运行时,sp​​ring boot 将生成代理类,该类将具有基本的 CRUD(创建更新删除)方法,您可以调用并保存您的数据。

【讨论】:

  • 我会调查这个,但我们还没有了解这个:P 但这会解决我的问题吗?因为它根本不会接受我的输入并存储它。当我在 intellij 中有我的代码时,导入 com.example.demo.billett;是灰色的,我认为它根本找不到控制器和应用程序
  • 在你的控制器中发现了一个错误所以在 public void lagre(billett billett) 中你需要将它更改为 public void lagre(@RequestBody Billett billett),这将表明你期待一个 json 对象将映射到您的 POJO(普通 java 对象)。同样在您的存储库中,我建议您使用哈希图而不是数组列表,因为您可以通过 ID 模拟 DB 查询,并且您不必为了获得单个值而遍历整个列表:) 希望它有所帮助,如果没有给我发私信,我们会修复它:)至于前端代码,不能真正帮助你,对不起
【解决方案2】:

问题出在您的 HTML 中。这一行是错误的:

<button id="kjop();">Kjøp Billet</button>

应该是:

<button id="kjop">Kjøp Billet</button>

问题在于您没有将“click”事件侦听器附加到按钮,因为 ID 错误。所以这无济于事:

$("#kjop").click (() => {
    ...
});

【讨论】:

    猜你喜欢
    • 2019-03-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-04-21
    相关资源
    最近更新 更多