How can I add a URL link before each filename of all user post that is an image?-CodePudding

I am building a full-stack application with React.js and Springboot that takes images from a user and allows them to title that image and post it as a user post, for example:

User image: myImage.jpeg and Title: This is the title to myImage

I have successfully created an API that allows for this to be stored in my database as you see below in my UserPost table:

I am using an AWS S3 bucket to store the image file. In this same application, each user has a profile that contains a user profile image and a banner image for their profile card. I created an API that allows for this functionality, however, currently, I need to load each user's specific profile image and banner through a specific URL link that is connected to my S3 bucket. Below is an example of a GET request for a demo user's profile.

As you can see, the filename for both the profile image and banner are stored and then added to the end of each reconstructed URL link in profile_img_complete and profile_banner_complete respectively, and each link contains the image so that it can be seen. I was able to accomplish the GET request API method so that each profile image and banner filename is added to the reconstructed link for viewing as seen in the following method that is in my UserProfileController class:

    @GetMapping("/profile")
    public UserProfile profile(Model model, HttpServletRequest request) {

        final String authHeader = request.getHeader(AUTH_HEADER);
        String username = null;
        String jwt = null;

        if (authHeader != null && authHeader.startsWith("Bearer")) {
            jwt = authHeader.substring(7);
            username = jwtUtils.getUserNameFromJwtToken(jwt);
        }

        //Load logged in Username from JWT Token obtained
        UserDetailsImpl customUser = (UserDetailsImpl) userDetailsService.loadUserByUsername(username);
        Long userId = customUser.getId();

        UserProfile userProfile = userProfRepo.findByUserId(userId);



        model.addAttribute("profile_img", userProfile.getProfile_img_complete());
        model.addAttribute("profile_banner", userProfile.getProfile_banner_complete());

        return userProfile;

    }

The last three lines of code are very important in this function as it is where the URL link reconstruction is being done with model.addAttribute, so that the links are made correctly for viewing the image when it gets pulled when a user is viewing their own profile card. So now that I have explained how I am pulling images using a reconstructed link, let me finally explain my problem with user posts (not user profile).

As I said, I want a user to post an image and have them title that image. Once a user post is submitted, I want it to be stored in my database (done with this) and then I want all post of all users to be displayed on a specific page in my web application, and this is where I need help desperately. I need to figure out a way to add the filename in my "post_image" columns of each post to the link which will be post_img_complete in my request body. This is what I have tried so far in my UserPostController:

 @GetMapping("/list")
    @JsonIgnoreProperties({"hibernateLazyInitializer", "handler"})
    public List<UserPost> post(Model model) {

        List<UserPost> allUserPosts = userPostRepo.findAllByOrderByIdDesc();

        model.addAttribute("post_image", allUserPosts.getPost_img_complete()); // Error here: Cannot resolve method 'getPost_img_complete' in 'List'

        return allUserPosts;
    }

Here is my UserPost entity class (Using JPA Hibernate) that contains my getPost_img_complete() method with the URL link I am talking about:

package com.Application.models;

import javax.persistence.*;

@Entity
@Table(name = "user_posts")
public class UserPost {
    @Id
    @Column(name = "id")
    @GeneratedValue(strategy=GenerationType.IDENTITY)
    private Long id;

    @ManyToOne(cascade = {CascadeType.ALL}, fetch = FetchType.LAZY)
    @JoinColumn(name = "user_id", nullable = false)
    private UserProfile user;

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

    @Column(name = "post_image")
    private String postImage;

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


    public Long getId() {
        return id;
    }

    public UserProfile getUser() {
        return user;
    }

    public void setUser(UserProfile user) {
        this.user = user;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public String getPostImage() {
        return postImage;
    }

    public String getPost_img_complete() {
        return " https://bucket.s3.us-east-2.amazonaws.com/"   postImage;
    }

    public void setPostImage(String postImage) {
        this.postImage = postImage;
    }
}

I know this may not be the most efficient way of pulling images stored in an S3 bucket, but it is what I am doing at the moment. So for each posts filename, I need it to be added to the end of the URL link in getPost_img_complete for viewing so that all posts can have the images be viewed when the page is loaded. I think it may have something to do with the fact that I am using a list this time compared to before where I was not (In my user profile example I showed above). If anyone could help me understand what I need to do to accomplish this, it would be a HUGE help. Sorry it took so long to get to the point, I just wanted to include the right information for context on my problem. Thanks in advance, I will add any information that would help me solve this problem if necessary.

CodePudding user response：

You can't do model.addAttribute("post_image", allUserPosts.getPost_img_complete()); since allUserPosts is a list.

Try to iterate over it :

List<UserPost> allUserPosts = userPostRepo.findAllByOrderByIdDesc();

allUserPosts.forEach(post -> model.addAttribute("post_image", post.getPost_img_complete()));