[0.74.3] getJSON on localhost with local feed.json

Hi, all.

On my site, I build feed.json for syndication without any problem…
(I explain how I build this on this article - only in FR)

And I have a search engine builded with JQuery UI autocomplete method.


My last idea was to manage this search engine with Hugo getJSON, as:

        <div class="search">
            <input id="search" class="form-control" placeholder="{{ i18n "searchHolderTitle" }}">
            <input id="replyer" type="hidden">            
                {{- $baseURL := (printf "%s%s" $.Site.BaseURL $.Site.Language.Lang) | absLangURL -}}
                {{- $feed := (printf "%s%s" $baseURL "/feed.json") | safeURL -}}
                
                <!-- Javascript -->
                <script>
                    $(function() {
                    var projects = [
			            {{- with getJSON $feed -}}
                        {{- range .items -}}
                        {{- $url := safeURL .url -}}
                        {{- $title := safeHTML .title -}}
                        {{- $desc := safeHTML .summary -}}                      
                        {
                            value: "{{ $title }}",
							label: "{{ $desc }}",
                            url:"{{ $url }}"
                        },
                        {{- end -}}
                        {{- end -}}
                    ];
                    $( "#search" ).autocomplete({
						delay: 100,
                        minLength: 0,
                        source: projects,
                        focus: function( event, ui ) {
                            $( "#search" ).val( ui.item.label );
                            return false;
                        },
                        select: function( event, ui ) {
                            $( "#search" ).val( ui.item.label );
                            $( "#replyer" ).val( ui.item.value );
                            return false;
                        }
                    })
                    .data('ui-autocomplete')._renderItem = function(ul, item) {
                        return $('<li>')
                        .append('<a href="' + item.url + '" alt="'+ item.label + '">' + item.value + '</a>' )
                        .appendTo(ul);
                    };
                    });
                </script>
				
            <hr>
        </div>

But, when I execute hugo server, it cant build site with a lot of error messages:

Actualy, to avoid this, I modified my code as:

        <div class="search">
            <input id="search" class="form-control" placeholder="{{ i18n "searchHolderTitle" }}">
            <input id="replyer" type="hidden">            
                {{- $baseURL := (printf "%s%s" $.Site.BaseURL $.Site.Language.Lang) | absLangURL -}}
                {{- $feed := (printf "%s%s" $baseURL "/feed.json") | safeURL -}}
                {{- if not (in $baseURL "localhost:1313") -}}
                <!-- Javascript -->
                <script>
                    $(function() {
                    var projects = [
						{{- with getJSON $feed -}}
                        {{- range .items -}}
                        {{- $url := safeURL .url -}}
                        {{- $title := safeHTML .title -}}
                        {{- $desc := safeHTML .summary -}}                      
                        {
                            value: "{{ $title }}",
							label: "{{ $desc }}",
                            url:"{{ $url }}"
                        },
                        {{- end -}}
                        {{- end -}}
                    ];
                    $( "#search" ).autocomplete({
						delay: 100,
                        minLength: 0,
                        source: projects,
                        focus: function( event, ui ) {
                            $( "#search" ).val( ui.item.label );
                            return false;
                        },
                        select: function( event, ui ) {
                            $( "#search" ).val( ui.item.label );
                            $( "#replyer" ).val( ui.item.value );
                            return false;
                        }
                    })
                    .data('ui-autocomplete')._renderItem = function(ul, item) {
                        return $('<li>')
                        .append('<a href="' + item.url + '" alt="'+ item.label + '">' + item.value + '</a>' )
                        .appendTo(ul);
                    };
                    });
                </script>
				{{- end -}}
            <hr>
        </div>

It’s not possible to use himself JSON into localhost?
One idea, suggestion?

You cannot generate data from data that hasn’t been generated.
You cannot request data from a site that isn’t accepting requests.