Images not displayed after rewrite rule for HTTPS

I am working on a MVC Web App hosted in Azure Cloud. Everything worked fine since I put a rule for rewriting URLs to force HTTPS :

<rewrite>
  <rules>
    <clear />
    <rule name="Redirect to https" stopProcessing="true">
      <match url="(.*)" ignoreCase="false" />
      <conditions>
        <add input="{HTTPS}" pattern="off"  />
      </conditions>
      <action type="Redirect" url="https://{HTTP_HOST}/{R:1}" redirectType="Permanent" appendQueryString="true" />
    </rule>
  </rules>
</rewrite>

All my images are now not displayed in production. Here is the razor I use to display Images :

<img src="@Url.Content("~/Content/Images/Picture.png")" />

I've tried to put off the rewrite rule but it seems to be "permanent", even if the related code is commented in web.config.

I've already tried to add this to my web.config :

<configuration>
 <location path="~/Content/Images">
  <system.web>
     <authorization>
        <allow users="*"/> ---or even "?"
     </authorization>
  </system.web>

but nothing change.

Any ideas ?

Thanks.

-- EDIT To be the most complete, here is the head node of my _layout page :

@*@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")*@
@Styles.Render("~/Content/Site.css")
@Styles.Render("~/Content/Slick/slick.css")
@Styles.Render("~/Content/Slick/slick-theme.css")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/Scripts/Slick/slick.min.js")
@Scripts.Render("~/bundles/bootstrap") 
@RenderSection("scripts", required:=False)

Maybe I set them in a wrong order ? It would be surprising because it worked before.

Btw now, in debug mode, I have no more CSS/JS too !

Answers


Let start with: I've tried to put off the rewrite rule but it seems to be "permanent", even if the related code is commented in web.config.

Permanent redirects are stored in browser, and yes you want them to be stored in browser like that when you access x -> redirect from server to -> y browser help you to speed up things giving you the exact page. Clean you navigation history and the browser will access again original resource.

Problem with images from http to https, in order to have it work you need to make sure you are serving correct images with http.

First step:

<system.webServer>
  <rewrite>
    <rules>
      <rule name="Redirect to https">
        <match url="(.*)" />
        <conditions>
          <add input="{HTTPS}" pattern="off" ignoreCase="true" />
          <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
        </conditions>
        <action type="Redirect" url="https://{SERVER_NAME}/{R:1}" redirectType="Permanent" appendQueryString="true"  />
      </rule>
    </rules>
  </rewrite>

Excluding files to be redirected to https you can check if indeed the files are accessible without https. If you get 404 again you have a problem with http access over files in azure (witch need to be accessible before performing redirect). And make sure you are not having other redirects or rewrites for files after this rule.

If this ain't the problem, make sure if you are changing manually in url from http to https for images is working (again check for rewrites or redirects)

If you can access the images it means it was a cache problem on your browser or fiddler. If not then you have a incorrect hosted app, images hosted under another app on same instace, wwroot vs your app folder if you have something like this, check again what @Url.Content does and see who is serving you int that case.


Ok ! I'e finally found the issue. What I've done is to put this rule in my web.config :

<rewrite>
 <rules>
  <rule name="Redirect to https">
    <match url="(.*)" />
    <conditions>
      <add input="{HTTPS}" pattern="off" ignoreCase="true" />
      <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
    </conditions>
    <action type="Redirect" url="https://{SERVER_NAME}/{R:1}" redirectType="Permanent" appendQueryString="true"  />
  </rule>
</rules>

Mine was not correct I think. Thanks to @SilentTremor.

Then I rewrote from scratch these calls :

From

@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/Scripts/jquery-2.2.0.min.js")
@Styles.Render("~/Content/Site.css")
@Styles.Render("~/Content/Slick/slick.css")
@Styles.Render("~/Content/Slick/slick-theme.css")
@Scripts.Render("~/Scripts/Slick/slick.min.js")

To

@Styles.Render("~/Content/css")
@Styles.Render("~/Content/Slick/slick.css")
@Styles.Render("~/Content/Slick/slick-theme.css")
@Scripts.Render("~/Scripts/jquery-2.2.0.min.js")
@Scripts.Render("~/Scripts/Slick/slick.min.js")
<link rel="Stylesheet" href="@Url.Content("~/Content/Site.css")" />

Now when I must debug in local, I comment the rules in web.config because localhost doesn't accept HTTPS. I could add a condition in the rule to negate localhost adresses but don't want to modify this file for now.


Need Your Help

Get external website's meta-description after returning success page in Django

python django

I need to get the meta-description of an external website entered by the user. My code currently does this but it has to wait for the external website to respond. This is a problem for obvious reas...

JScrollPane Not Wide Enough When Vertical Scrollbar Appears

java swing jscrollpane

I have two JScrollPanes in the same window. The one on the left is large enough to display the contents of the contained panel. The one on the right is not large enough to display its contents and ...