将ArraList转换为JSON(Java）并使用Javascript访问它

该项目的目的是选择图像的一个区域，将该区域发送到数据库，检索该选定区域并绘制所选图像的区域。我有一个充满坐标行的数据库。所以我做了一个对象 - Area，用坐标行来表示该表。ViewArea 有四个值：int x1、int x2、int y1 和 int y2。

public class ViewArea extends Area
{
    public ViewArea(int x1, int y1, int x2, int y2)
    {
        super(x1, x2, y1, y2);
    }
}

由于行数可能越来越多，这意味着Area对象的数量也在增加，因此我创建了一个带有List的AreaInputView类。在类的 init（） 中，我填充列表并将其转换为 JSONArray（如谷歌搜索时的示例所示）。

@ManagedBean
@ApplicationScoped
public class AreaInputView implements Serializable
{
    /**
     * 
     */
    private static final long serialVersionUID = -3957666682646196671L;
    MyDatabase db = new MyDatabase();
    private List<ViewArea> areaList;
    private JSONArray jsonAreaList;
    public List<ViewArea> getAreaList()
    {
        return areaList;
    }

    @PostConstruct
    public void init()
    {
        this.areaList = new ArrayList<ViewArea>();
        populateList();
        this.jsonAreaList = new JSONArray(areaList);
    }

    public JSONArray getJsonAreaList()
    {
        return jsonAreaList;
    }
    public void populateList()
    {
        db.openDatabase();
        try
        {
            db.pstmt = db.con.prepareStatement("SELECT * FROM area");
            ResultSet rs = db.pstmt.executeQuery();
            while (rs.next())
            {
                areaList.add(new ViewArea(rs.getInt("X1"), rs.getInt("X2"), rs.getInt("Y1"), rs
                        .getInt("Y2")));
            }
        }
        catch (SQLException e)
        {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
    }

}

到目前为止一切顺利..现在我们去js。在JS中，我创建了一个函数，该函数接受四个值，然后我使用这些值在画布上绘制图像，这是正在使用的图像。

function viewInput(dx1,dy1,dx2,dy2) {
    var canvas = document.getElementById('home:tempImg');
    var context = canvas.getContext('2d');
    var imageObj = new Image();
    imageObj.onload = function() {
      context.drawImage(imageObj, dx1, dy1,dx2-dx1,dy2-dy1);
    };
    imageObj.src = 'images/selected.png';
}

我的问题是我无法从javascript访问JSON对象，因为javascript是客户端，而JSON在java中，java是服务器端。重点是遍历 JSON 对象，并为每个对象应用 js 函数。我可以选择将数据写入.js文件，以便我可以在那里访问它，但必须有办法解决这个问题。有什么建议吗？