QUploader component in Julia - vue.js

Question

I have been developing an application in Julia using Genie Framework and Stipple, and the main task of this app is to implement Sobel and Prewitt operator. The problem that I am struggling with is the uploader component. So basically I am able to upload an image, on button click the image is transformed, but then when i upload another image and try to output the transformed version of it, the output that i get is still the old image. I have been trying to find the issue and I noticed that QUploader API has some methods that could help solve this problem: reset() method, or removeUploadedFiles() method, but I do not know how to call/use these functions regarding Julia syntax. Are there any solutions available?
const FILE_PATH = "public/sample.jpg"
const FINAL_PATH = "final.jpg"
#const IMGPATH = "demo.png"
model = Model |> init
on(model.process_s3) do _
model.imageurl[] = ""
#info "Working"
img = FileIO.load(FILE_PATH)
img_gray = Gray.(img)
#info img_gray
sobel_image = convert(Array{Float64}, img_gray)
lastImage = clamp01nan.(sobel(sobel_image, sobel3_kernel_x, sobel3_kernel_y))
save(joinpath(#__DIR__, "public", FINAL_PATH), lastImage)
model.imageurl[] = "/$FINAL_PATH#$(Base.time())" * string(rand())
#info model.imageurl[]
if (model.process_s3[])
model.process_s3[] = false
end
end
function ui(model)
[
page( model,
class = "container",
title = "Card Demo",
partial = true,
[
row( # row takes a tuple of cells. Creates a `div` HTML element with a CSS class named `row`.
cell([h1("Edge Detection Project")]),
)
row(
[
cell(class="st-module", [
h2("Initial Image"),
card(
class = "q-pa-md row items-start q-gutter-md",
uploader(
label = "Upload Image",
method = "POST",
:multiple,
url = "http://localhost:8000/upload",
field__name = "img",
:finish="finished",
ref="uploader"
),
),
btn("Sobel 3x3",color="primary", #click("process_s3 = true")),
])
cell(class="st-module", [
h2("Transformed Image"),
card(
class = "q-pa-md row items-start q-gutter-md",
#quasar(:img, src=:imageurl, spinner__color="white", style="height: 300px; max-width: 350px")
imageview(src=:imageurl, spinner__color="white", style="height: 250px; max-width: 250px")
),
])
],
)
],
),
]
end
route("/") do
html(ui(model), context = #__MODULE__)
end
route("/upload", method = POST) do
if infilespayload(:img)
#info Requests.filename(filespayload(:img))
open(FILE_PATH, "w") do io
write(FILE_PATH, filespayload(:img).data)
#info File
end
else
#info "No image uploaded"
end
Genie.Renderer.redirect(:get)
end
# isrunning(:webserver) || up()

Answer 1

Replace:
"/$FINAL_PATH#$(Base.time())"
with
"/$(FINAL_PATH)?t=$(Base.time())"
Explanation:
# makes just an anchor link to an HTML document. This will obviously result in buffering the document as the browser might just look for different anchors (and not find them) yet has no motivation to re-download.
On the other hand adding the ? makes the request actually different every time (understood by browser as a different document). In result the cache will not be used - a new copy gets requested.