When I used Nextjs Client with http and C# Api with Http, I can make the client show the images which is saved in the virtual directory. But when I upgrade my nextjs to Https, the images do not show anymore. As I see in F12 in client, all of my image path was converted to have https. Eg: http://domain.info/images/filename.jpg was converted to https://domain.info/images/filename.jpg
I use IIS Window Server to upload my code.
My image code:
{logoData ?
<div className="logo">
<img className="img-fluid" src=
{BaseGatewayImage + logoData.imagePath} alt="Newsprk" data-lazy-src=
{BaseGatewayImage + logoData.imagePath} />
</div> : <></>}
this is the images after https:
Images after https
Can some one help me with this case? Do I have to upgrade my api to https?
Related
I am uploading png pictures in asp.net mvc. And I save their address in the database. I get a 404 error while displaying some images on the http page. Whereas on https, the images are loaded and the images are exist.
This problem exists only for png images or a specific folder. This is not a problem with jpeg images.
please help me
<img class="default-img" src="#item.Image" alt="">
item.Image="/images/Post/166362.png"
My application is an Api ASP.Net, and I save the images in the "wwwroot" folder
Content
When I publish my application that structure is created as well and I want to access the images through a URL
From Client Angular 2
<img src="{{ 'http://192.168.1.20/Api/api/uploads/Koala.jpg'}} " >
(Not Found)
I must mention, that my application is published locally, and users connected to the network must access the images
Question
How to access the image found on the IIS server with the Url?
I am right?
Correct me if I'm wrong
Thank you all
First try to access the image url on the browser i.e.,
http://localhost/Api/api/uploads/Koala.jpg
If it displays the image then there is not problem with you IIS hosting.
Now try the same url from a different machine in the network i.e.,
http://192.168.1.20/Api/api/uploads/Koala.jpg (from a different machine)
If it does not work then make sure that you machine accepts http inbound traffic over the network.
Use tilde ~ for relative URL in paths:
<img src="{{ '~/uploads/Koala.jpg'}} " >
Based on my understanding, you shouldn't specify the full URL in <img src="{{ }}">.
If you want to specify full URL in Src attribute, you don't need angular. You should just remove {{''}} and modify the URL to
<img src="http://192.168.1.20/Api/api/uploads/Koala.jpg" >
If you want to use angular2 in this case, you should just modify the URL like
<img src="{{imageUrl}}">
Then declare the variable imageUrl in Component.
Our Application setup:
Azure web app running .NET 4.7 (MVC 5)
Azure Akamai CDN enabled with "Custom Origin" & "Cache every unique URL" pointing to the MVC app.
Web App uses Nuget "Microsoft.AspNet.Web.Optimization version 1.1.3" for bundling and minification.
Problem: The bundled JS & CSS served from the Azure Akamai CDN always show as a TCP_MISS.
Example URL: https://cdn.somesite.com/Content/Styles/bundlePreview?v=WOktWxTaT0JTWFR4n5uq7yUWk-P2XVrmQNGQWYBW6eg1
Response Headers of CDN via Postman using a custom header - Pragma: akamai-x-cache-on)
Response Headers of the Origin Server for the same above bundled resource
The "Date" & "Expires" header of both the CDN and Origin server gets a new date every time the request is sent via Postman.
Can someone give an idea as to why there is a TCP_MISS only for the bundled JS & CSS? Images & Fonts are cached properly.
Thanks.
I have an asp.net C# application hosted by IIS 7. I have installed a valid SSL Certificate and used Security Switch in order to transfer each page from HTTP protocol to HTTPS.
On one of my pages, I use JQUERY. Specificly, I have a canvas that I draw some stuff on using Javascript, and also a GridView that I use the tablesorter jquery plugin on.
Both does not work when I use the https connection, meaning that the canvas is empty, and the gridview isn't shown.
If I use the normal HTTP protocol everything works fine. Furthermore, If I don't use the tablesorter plugin on the gridview than I can see it even when using https.
I Suspect that the https connection is blocking my javascript, although when using google chrome and looking at the certificate(by clicking on the little lock at the address bar) it says "java script enabled".
My JQUERY itself is being refrenced at the MASTER PAGE of my website, while the other scripts (drawing on canvas and table sorter) are being imported on the page itslef in the header section such as this:
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<script type="text/javascript" src="/Scripts/jquery.tablesorter.js"></script>
</asp:Content>
Looking at chromes console I see the following (only when using the https connection):
[blocked] The page at **** ran insecure content from http://fonts.googleapis.com/css?family=Archivo+Narrow.
Resource interpreted as Script but transferred with MIME type text/html: "https://****/Scripts/jquery.tablesorter.js".
Resource interpreted as Script but transferred with MIME type text/html: "https://****/Scripts/AquaGauge.js".
Resource interpreted as Script but transferred with MIME type text/html: "https://*****/Scripts/jquery-1.10.1.min.js".
Uncaught SyntaxError: Unexpected token < Scripts/jquery-1.10.1.min.js:1
[blocked] The page at https://***** ran insecure content from http://fonts.googleapis.com/css?family=Archivo+Narrow.
Uncaught ReferenceError: $ is not defined
How can I make my javascript code also when using HTTPS connection?
I fixed it. The javascript is being loaded threw a full path (https://yoursite.com/Script/jquery.js) although it is local, and not via file:// or anything else.
One must add threw Security Switch also the links to these files.
I have a file upload control on .aspx page where I am extracting basic file information. The requirement is that I need to save absolute path for selected file from client's machine to a db.
I have read on this site as well as else where that by nature ASP.NET doesn't allow to read information from client's machine for security reason.
But I am wondering if there is a way around this issue using js or something to get the absolute path and then pass it to asp.net variables?
You can't really do anything reasonable about this restriction.
Any fully trusted code on users' machine can do that. So your goal is to convince user to install something that will provide you with the information.
For Windows (all require instalation of some sort):
ActiveX controls
Native EXE
Locally installed managed EXE
locally installed HTA for IE only
I believe almost all platforms also have ways to to so... with similarly painful installation requirements.
You can't get client machine path. For security purposes, the browser will never post the full file's path.
You can't get full path of the file.
For security purposes, the browser will never post the full file's path.
Try to use below code in java script.
lbltext.Text = FileUpload1.PostedFile.FileName
Browser send file without full file path, so to retrieve file path you do it on client side via javascript function:
<script type="text/javascript">
function OnSubmitHandler(myForm)
{
var fileUpload = document.getElementById('<% = FileUpload1.ClientID %>');
myForm.action = myForm.action + "?FilePath=" + fileUpload.value;
return true;
}
</script>
<form id="Form1" method="post" runat="server" onsubmit="return OnSubmitHandler(this);">
...
<asp:FileUpload id="FileUpload1" .... />
...
</form>
If you don't want to send a file path via query string, you can create hidden form field, so file path will be sent via post.