Question

我一直在研究使用Spring Boot后端API服务器连接Node.js / AngularJS前端服务器，但我一直遇到障碍。我还没有在网上找到一个单一的工作示例。

Spring示例都在Spring Boot应用程序中提供Angular代码，但出于多种原因，这是一种可怕的做法。

有人可以指出Node.js / AngularJS前端服务器的一些工作示例是否成功地与后端Spring Boot服务器进行数据/ API事务？

通常情况下，我绝不会发一个问题要求提出问题，但这是一个特例，因为我的研究都没有找到工作实例，而我对这个主题的问题似乎永远无法解决这个基本问题。

Answer 1

你好这是春天的api终点

@RestController
@RequestMapping("/api")
public class ExtendedRegisteredTimeResource {


    @Inject
    private ExtendedRegisteredTimeService ExtendedRegisteredTimeService;




    @GetMapping("/extended-registered-time/{employee}")
    @ResponseBody
    public ResponseEntity<List<Registered_time>> getSubLeaves(@PathVariable String employee) {

        List<Registered_time> result = ExtendedRegisteredTimeService.getSelectedRegisteredTime(employee);

        return new ResponseEntity<>(result, HttpStatus.OK);

    }

}

上面搜索在前端传递的员工姓名。我手动传递了我的名字。

(function() {
    'use strict';
    angular
        .module('cambioConnectApp')
        .factory('RegisteredTimeService', RegisteredTimeService);

    RegisteredTimeService.$inject = ['$resource'];

    function RegisteredTimeService ($resource) {

        var userName="HGajanayake";



       // var resourceUrl =  '/api/extended-registered-time?employee='+userName;
        var resourceUrl =  "/api/extended-registered-time/:employee";
        return $resource(resourceUrl, {}, {
            'query': {

                method: 'GET',

                isArray: true
            },

            'status':{
                method:"POST",
                isArray:true,

                transformRequest: function (data) {
                    var copy = angular.copy(data);
                    return angular.toJson(copy);
                }
            }

        });

这是实施查询的存储库

public interface ExtendedRegisteredTimeRepository extends Registered_timeRepository {




    @Query("SELECT e from Registered_time e where e.employee=:employee ")
    public List<Registered_time> getSelectedRegisteredTime(@Param("employee") String employee);


}

这是使用Autowired注释的服务实现

@Service
@Transactional
public class ExtendedRegisteredTimeServiceImpl implements ExtendedRegisteredTimeService {






    @Autowired
    private ExtendedRegisteredTimeRepository ExtendedRegisteredTimeRepository;


    @Override
    public List<Registered_time> getSelectedRegisteredTime(String employee) {


       return ExtendedRegisteredTimeRepository.getSelectedRegisteredTime(employee);
    }



}

您还必须创建表格的DTO

@Entity
@Table(name = "registered_time")
@Cache(usage = CacheConcurrencyStrategy.NONSTRICT_READ_WRITE)
public class Registered_time implements Serializable {

    private static final long serialVersionUID = 1L;

    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long id;

    @Column(name = "employee")
    private String employee;

    @Column(name = "employee_department")
    private String employee_department;

    @Column(name = "employee_organisation")
    private String employee_organisation;

    @Column(name = "project")
    private String project;

    @Column(name = "project_organisation")
    private String project_organisation;

    @Column(name = "row_number")
    private Integer row_number;

    @Column(name = "local_date")
    private LocalDate local_date;

    @Column(name = "total_cost")
    private Float total_cost;

    @Column(name = "total_time")
    private Float total_time;

    public Long getId() {
        return id;
    }

    public void setId(Long id) {
        this.id = id;
    }

    public String getEmployee() {
        return employee;
    }

    public Registered_time employee(String employee) {
        this.employee = employee;
        return this;
    }

    public void setEmployee(String employee) {
        this.employee = employee;
    }

    public String getEmployee_department() {
        return employee_department;
    }

    public Registered_time employee_department(String employee_department) {
        this.employee_department = employee_department;
        return this;
    }

    public void setEmployee_department(String employee_department) {
        this.employee_department = employee_department;
    }

    public String getEmployee_organisation() {
        return employee_organisation;
    }

    public Registered_time employee_organisation(String employee_organisation) {
        this.employee_organisation = employee_organisation;
        return this;
    }

    public void setEmployee_organisation(String employee_organisation) {
        this.employee_organisation = employee_organisation;
    }

    public String getProject() {
        return project;
    }

    public Registered_time project(String project) {
        this.project = project;
        return this;
    }

    public void setProject(String project) {
        this.project = project;
    }

    public String getProject_organisation() {
        return project_organisation;
    }

    public Registered_time project_organisation(String project_organisation) {
        this.project_organisation = project_organisation;
        return this;
    }

    public void setProject_organisation(String project_organisation) {
        this.project_organisation = project_organisation;
    }

    public Integer getRow_number() {
        return row_number;
    }

    public Registered_time row_number(Integer row_number) {
        this.row_number = row_number;
        return this;
    }

    public void setRow_number(Integer row_number) {
        this.row_number = row_number;
    }

    public LocalDate getLocal_date() {
        return local_date;
    }

    public Registered_time local_date(LocalDate local_date) {
        this.local_date = local_date;
        return this;
    }

    public void setLocal_date(LocalDate local_date) {
        this.local_date = local_date;
    }

    public Float getTotal_cost() {
        return total_cost;
    }

    public Registered_time total_cost(Float total_cost) {
        this.total_cost = total_cost;
        return this;
    }

    public void setTotal_cost(Float total_cost) {
        this.total_cost = total_cost;
    }

    public Float getTotal_time() {
        return total_time;
    }

    public Registered_time total_time(Float total_time) {
        this.total_time = total_time;
        return this;
    }

    public void setTotal_time(Float total_time) {
        this.total_time = total_time;
    }

    @Override
    public boolean equals(Object o) {
        if (this == o) {
            return true;
        }
        if (o == null || getClass() != o.getClass()) {
            return false;
        }
        Registered_time registered_time = (Registered_time) o;
        if (registered_time.getId() == null || getId() == null) {
            return false;
        }
        return Objects.equals(getId(), registered_time.getId());
    }

    @Override
    public int hashCode() {
        return Objects.hashCode(getId());
    }

    @Override
    public String toString() {
        return "Registered_time{" +
            "id=" + getId() +
            ", employee='" + getEmployee() + "'" +
            ", employee_department='" + getEmployee_department() + "'" +
            ", employee_organisation='" + getEmployee_organisation() + "'" +
            ", project='" + getProject() + "'" +
            ", project_organisation='" + getProject_organisation() + "'" +
            ", row_number='" + getRow_number() + "'" +
            ", local_date='" + getLocal_date() + "'" +
            ", total_cost='" + getTotal_cost() + "'" +
            ", total_time='" + getTotal_time() + "'" +
            "}";
    }
}

Answer 2

我过去曾在一个项目中工作，我们使用AngularJs在Node.Js上部署了前端。我们使用bower和nodejs来管理依赖关系。 Nodejs也被用作前端的服务器。前端是使用angularJs开发的。 Spring rest Web服务暴露在前端。我没有代码，但我可以看看你是否可以分享你的代码。

Node.js / AngularJS前端调用Spring Boot API后端

2 个答案: