Odd Behavior on Image Size in HTTPS - html

I have been learning HTML and CSS and i am creating a WebSite there is a section where I add 3 images, and this images have an odd behavior when displaying.
when I access to the website on Samsung Internet under HTTP i get them as expected: like this
but when I access under HTTPS i get: this
I have notice that it works under HTTP and HTTPS on other browsers like chrome.

This issue is an instance of mixed content that occurs when HTML pages load over a secure HTTPS connection but link to resources (images, CSS, or JS) over an insecure HTTP connection. This is generally triggered by inputting an image within the page that runs over an HTTP connection. When you upload and post images but do not update the image links on the page after getting an SSL certification, the browsers will recognize them as insecure elements.
For your own domain, serve all content as HTTPS and fix your links. Often, the HTTPS version of the content already exists, and this just requires adding an “s” to links – http:// to https://.
For images hosted on other domains, use the site’s HTTPS version if available.
sitechecker

Related

HSTS in iFrame src

I'm building an app that needs to serve websites in an iframe. Since the websites are decided by the user, they usually enter only the domain name, like google.com, or facebook.com. To render the website in an iframe i need to add http:// to this (I can't add https://, since the website may not be served over ssl which will cause it to not render at all.)
For this reason, I am forced to not use ssl on my website, since due to the mixed content policy, I can't add iframes that request http. I wish to know if there's a way to force hsts in the iframe src. For example, if I request http://example.org, the iframe will automatically render https://example.org (since it exists.)
HTTPS doesn't allow you to serve HTTP content. All content on the page must be a secure connection, including iFrame. This is browser standard so there's no work around to be had. Either your page has to be HTTP or the iFrame has to be HTTPS.

Chrome extension - Disable Blocking of Mixed Content [duplicate]

This question already has an answer here:
Since v38, Chrome extension cannot load from HTTP URLs anymore, workaround?
(1 answer)
Closed 6 years ago.
So I'm building a Chrome extension that takes images from the current tabs and sends those images to a server to host the image. It works great for many sites, but on major sites like Instagram and Pinterest, it won't work because the browser blocks mixed content (HTTP and HTTPS). I get the following error message in the console:
Mixed Content: The page at 'https://www.instagram.com/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint. This request has been blocked; the content must be served over HTTPS.
I checked this post and it doesn't appear to help me with regards to extensions spcifically: https://productforums.google.com/forum/#!topic/chrome/OrwppKWbKnc
Also, I tried to add the server URL to the permissions in manifest.json and that did nothing for me, either.
My question is this: is there a way for me to have a Chrome extension that allows mixed content for just my server or is my only option to switch my server over to HTTPS?
If you send http request from content scripts, since it lives in the same context with the webpage, it will be restricted by SOP, which is browser behavior.
You could move your http request from content scripts to background page (either by Message Passing or some other trigger like browser Action), since background page lives in the context of the extension, while extension itself can bypass the SOP by adding server URL to permissions.

rtmpt(e) stream on SSL Page

I'm developing audio streaming web service for PC browsers.
We want to use rtmpt(e) protocol for streaming with Flash plugin.
Main HTML page has https:// URL.
The problem is, when our SWF try to connect streaming server (via HTTP tunnelling), some browser (i.e. Chrome) shows warning on the secure icon in the URL bar:
Your connection to ???.???.com is encrypted with 128-bit
encryption. However, this page includes other resources which are not
secure. These resources can be viewed by others while in transit, and
can be modified by an attacker to change the look of the page.
and on the developer console:
The page at 'https://***.***.com/' was loaded over HTTPS, but displayed insecure content from 'http://stream.***.net/fcs/ident2': this content should also be loaded over HTTPS.
The page at 'https://***.***.com/' was loaded over HTTPS, but displayed insecure content from 'http://***.***.***.113/open/1': this content should also be loaded over HTTPS.
...
I think this is because Flash uses Browser's URL loading facility when accessing HTTP.
How can I avoid these warnings?
We don't want to use rtmp(e) because 1935 may be blocked by firewall on user environment, nor rtmps because our streaming server doesn't support it.
And We don't want to use http:// for main HTML because of requirement.
How can I avoid these warnings?
Fix the Mixed Content. Load everything over HTTPS.

Images are not loading in https protocol

i have a website which as working perfectly through http, but when i have secured https protocol for that website url, then the images are not loading on site, if we make refreshing page once or twice it will displays images else page loading for long time with no images shows.
The images on your page need to be loaded through the same protocol as the protocol present in the link.
So in conclusion if the website is loaded through https, the images need to be loaded through https also and the other way around.
This can be an issue with the code or possibly a ssl error. Please Contact your server and ask them for an ssl certificate. It be something to do with your computer/browser.

What to change in secure connection to set the styles?

I'm developing a website and get the webpage linked here. The problem is that the webpage is not rendered with the styles.
But when I open its source and copy it to a new file on my desktop, the style is now rendered approppriately. I couldn't figure out why it doesn't work on the secure connection. Any ideas?
From my browser's error console:
[blocked] The page at 'https://secure.nesinvakfi.org/nesinyayinevi/test.html' was loaded over HTTPS, but ran insecure content from 'http://www.nesinyayinevi.com/bootstrap/css/nybs.css': this content should also be loaded over HTTPS.
If you are going to use HTTPS, then use it everywhere in the page. Don't inject insecure content into the page, it makes using HTTPS pointless.
Open the console to see all sorts of errors:
The page at 'https://secure.nesinvakfi.org/nesinyayinevi/test.html' was loaded over HTTPS, but displayed insecure content from 'http://www.nesinyayinevi.com/bootstrap/img/grid-18px-masked.png': this content should also be loaded over HTTPS.
Failed to load resource: the server responded with a status of 404 (Not Found) https://secure.nesinvakfi.org/nesinyayinevi/resimler/english.jpg
In the first case, the scheme of the requested URL and the scheme of included resources need to match. Use https://www.nesinyayinevi.com You could also use //www to have the scheme automatically match that of the requested page, but since this is secure.nesinvakfi I have to imagine that it's going to be https.
If you can't use https for nesinyayinevi.com, then you're going to have to copy the resources over or otherwise proxy them through https.
As for the 404 errors, it seems like you are using a relative path like bootstrap/js, but these are for the wrong domain. You need to use the domain absolute path of https://nesinyayinevi.com like you are doing for the CSS files.