Captcha img not refreshing onclick()

[M-I-R]

Dear friend i am trying to get this onclick() refresh captcha already for days ,but not succeed to make it display correctly a new captcha image on clickiing refresh link.

Here is my code:

This is my view page:

...
...
...

                <div class="form-group ">
                    <div class="form-group refereshrecapcha">
                        {!! captcha_img('flat', ['id' => 'captcha_img']) !!}

                    <a href="#" onclick="refreshCaptcha()">Refresh</a>
                    </div>
                </div>
            </form>
     </div>
    </div>
...
...

//JS onclick refresh captcha:
 <script>
     function refreshCaptcha() {
         var captchaImg = document.getElementById('captcha_img');
         var newSrc = '/refereshcapcha'; // Add a random query string to force browser to refresh the image
         captchaImg.src = newSrc;
     }
 </script>
...
@endsection

here is my ContactContriller:

```php
...
...
    public function refereshCapcha(){
        return captcha_img('flat');
    }
}
'''

and routes:

Route::get('/refereshcapcha', [\App\Http\Controllers\ContactController::class, 'refereshCapcha']);
'''

If i do click on that ahref in my view blade the JS is calling the route ,then route call my function in my ContactController and it is not showing my contact form page,instead it is showing a white blank page with new generated cpatcha image ,instead of just refresh my captcha in my contact page without generating an new page.

I guess i have a logic error somewhere but after days of searching still cannot figure it out ;(

p.s. 
tried already github mews/captcha #52 ,#56 etc. as well on stackovflw etc. still no results.