Angular 6 rendering images from server










0















I have an api call that returns a list of urls for the images I want to render (http://localhost/api/files/getimage/4/Tulips.jpg)



The images get rendered with localhost, but with a api server I get



"Cross-Origin Read Blocking (CORB) blocked cross-origin response with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details."



How to make it work?






 <div *ngFor="let file of fileList">
<img src=file alt=file />
</div>












share|improve this question






















  • So, I had a typo and I have fixed it and it turned out that the CORB was a misleading warning. Now, image does not get downloaded at all with the remote server, no error message or warning. Any ideas?

    – Ubaid
    Nov 21 '18 at 13:13











  • It was a permissions issue, I had to give write access to the folder I was reading the images from

    – Ubaid
    Nov 21 '18 at 18:06















0















I have an api call that returns a list of urls for the images I want to render (http://localhost/api/files/getimage/4/Tulips.jpg)



The images get rendered with localhost, but with a api server I get



"Cross-Origin Read Blocking (CORB) blocked cross-origin response with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details."



How to make it work?






 <div *ngFor="let file of fileList">
<img src=file alt=file />
</div>












share|improve this question






















  • So, I had a typo and I have fixed it and it turned out that the CORB was a misleading warning. Now, image does not get downloaded at all with the remote server, no error message or warning. Any ideas?

    – Ubaid
    Nov 21 '18 at 13:13











  • It was a permissions issue, I had to give write access to the folder I was reading the images from

    – Ubaid
    Nov 21 '18 at 18:06













0












0








0








I have an api call that returns a list of urls for the images I want to render (http://localhost/api/files/getimage/4/Tulips.jpg)



The images get rendered with localhost, but with a api server I get



"Cross-Origin Read Blocking (CORB) blocked cross-origin response with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details."



How to make it work?






 <div *ngFor="let file of fileList">
<img src=file alt=file />
</div>












share|improve this question














I have an api call that returns a list of urls for the images I want to render (http://localhost/api/files/getimage/4/Tulips.jpg)



The images get rendered with localhost, but with a api server I get



"Cross-Origin Read Blocking (CORB) blocked cross-origin response with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details."



How to make it work?






 <div *ngFor="let file of fileList">
<img src=file alt=file />
</div>








 <div *ngFor="let file of fileList">
<img src=file alt=file />
</div>





 <div *ngFor="let file of fileList">
<img src=file alt=file />
</div>






angular6






share|improve this question













share|improve this question











share|improve this question




share|improve this question










asked Nov 15 '18 at 20:18









UbaidUbaid

13




13












  • So, I had a typo and I have fixed it and it turned out that the CORB was a misleading warning. Now, image does not get downloaded at all with the remote server, no error message or warning. Any ideas?

    – Ubaid
    Nov 21 '18 at 13:13











  • It was a permissions issue, I had to give write access to the folder I was reading the images from

    – Ubaid
    Nov 21 '18 at 18:06

















  • So, I had a typo and I have fixed it and it turned out that the CORB was a misleading warning. Now, image does not get downloaded at all with the remote server, no error message or warning. Any ideas?

    – Ubaid
    Nov 21 '18 at 13:13











  • It was a permissions issue, I had to give write access to the folder I was reading the images from

    – Ubaid
    Nov 21 '18 at 18:06
















So, I had a typo and I have fixed it and it turned out that the CORB was a misleading warning. Now, image does not get downloaded at all with the remote server, no error message or warning. Any ideas?

– Ubaid
Nov 21 '18 at 13:13





So, I had a typo and I have fixed it and it turned out that the CORB was a misleading warning. Now, image does not get downloaded at all with the remote server, no error message or warning. Any ideas?

– Ubaid
Nov 21 '18 at 13:13













It was a permissions issue, I had to give write access to the folder I was reading the images from

– Ubaid
Nov 21 '18 at 18:06





It was a permissions issue, I had to give write access to the folder I was reading the images from

– Ubaid
Nov 21 '18 at 18:06












1 Answer
1






active

oldest

votes


















0














 <div *ngFor="let file of fileList">
<img src="file" alt="file" />
</div>


<div *ngFor="let file of fileList">
<img [src]="file" alt="file" />
</div>





share|improve this answer























    Your Answer






    StackExchange.ifUsing("editor", function ()
    StackExchange.using("externalEditor", function ()
    StackExchange.using("snippets", function ()
    StackExchange.snippets.init();
    );
    );
    , "code-snippets");

    StackExchange.ready(function()
    var channelOptions =
    tags: "".split(" "),
    id: "1"
    ;
    initTagRenderer("".split(" "), "".split(" "), channelOptions);

    StackExchange.using("externalEditor", function()
    // Have to fire editor after snippets, if snippets enabled
    if (StackExchange.settings.snippets.snippetsEnabled)
    StackExchange.using("snippets", function()
    createEditor();
    );

    else
    createEditor();

    );

    function createEditor()
    StackExchange.prepareEditor(
    heartbeatType: 'answer',
    autoActivateHeartbeat: false,
    convertImagesToLinks: true,
    noModals: true,
    showLowRepImageUploadWarning: true,
    reputationToPostImages: 10,
    bindNavPrevention: true,
    postfix: "",
    imageUploader:
    brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
    contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
    allowUrls: true
    ,
    onDemand: true,
    discardSelector: ".discard-answer"
    ,immediatelyShowMarkdownHelp:true
    );



    );













    draft saved

    draft discarded


















    StackExchange.ready(
    function ()
    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53327296%2fangular-6-rendering-images-from-server%23new-answer', 'question_page');

    );

    Post as a guest















    Required, but never shown

























    1 Answer
    1






    active

    oldest

    votes








    1 Answer
    1






    active

    oldest

    votes









    active

    oldest

    votes






    active

    oldest

    votes









    0














     <div *ngFor="let file of fileList">
    <img src="file" alt="file" />
    </div>


    <div *ngFor="let file of fileList">
    <img [src]="file" alt="file" />
    </div>





    share|improve this answer



























      0














       <div *ngFor="let file of fileList">
      <img src="file" alt="file" />
      </div>


      <div *ngFor="let file of fileList">
      <img [src]="file" alt="file" />
      </div>





      share|improve this answer

























        0












        0








        0







         <div *ngFor="let file of fileList">
        <img src="file" alt="file" />
        </div>


        <div *ngFor="let file of fileList">
        <img [src]="file" alt="file" />
        </div>





        share|improve this answer













         <div *ngFor="let file of fileList">
        <img src="file" alt="file" />
        </div>


        <div *ngFor="let file of fileList">
        <img [src]="file" alt="file" />
        </div>






        share|improve this answer












        share|improve this answer



        share|improve this answer










        answered Nov 18 '18 at 13:27









        MahiMahi

        783421




        783421





























            draft saved

            draft discarded
















































            Thanks for contributing an answer to Stack Overflow!


            • Please be sure to answer the question. Provide details and share your research!

            But avoid


            • Asking for help, clarification, or responding to other answers.

            • Making statements based on opinion; back them up with references or personal experience.

            To learn more, see our tips on writing great answers.




            draft saved


            draft discarded














            StackExchange.ready(
            function ()
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53327296%2fangular-6-rendering-images-from-server%23new-answer', 'question_page');

            );

            Post as a guest















            Required, but never shown





















































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown

































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown







            這個網誌中的熱門文章

            How to read a connectionString WITH PROVIDER in .NET Core?

            In R, how to develop a multiplot heatmap.2 figure showing key labels successfully

            Museum of Modern and Contemporary Art of Trento and Rovereto