default Twitter button doesn't load image - api

I went to Twitter's resource page here (https://twitter.com/about/resources/tweetbutton) and got the following code:
Tweet<script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
When I put this in my Wordpress template, I don't get the Twitter button -- I just get the text "Tweet". However, when I change the src for widgets.js to include https:// or http:// at the beginning it works.
Could it be that it's just an error that they forgot the protocol? Also, do you think it is better to use https (for consistency with the share link) versus http, or does it not matter?
Thanks for your suggestions.

The URL "//example.com/script.js" tells the browser to open the URL using the protocol of the current page, which is likely to be "file://" if your browser opened an html file on your own machine. Of course, you don't have a file called "file://example.com/script.js" on your computer.
In the past, urls for embedded widgets used to include the protocol (http or https), but a site visitor would receive warnings whenever a secure page loaded a script from an insecure page, and sometimes even vice versa. Now, widgets from Twitter, Google Analytics, and other sites no longer specify the protocol so that the same embed code can work on any page on the internet. The downside is that this does not work when you embed such a widget into a file and view it on your own browser by double-clicking it!

Related

Firefox: "Some parts of this page are not secure, such as images." What counts as insecure?

I use the browser Firefox, and sometimes, on certain webpages, the SSL icon says "Some parts of this page are not secure, such as images." What, exactly, counts as an insecure element?
Thanks!
Anything that is delivered over an insecure channel.
What this generally means is that the developer of the web page is combining HTTP-based URLs with HTTPS-based URLs in the same page. The URLs could be for images as well as JavaScript, CSS, or anything else that can be referenced from a web page. As a user, there's not much you can do about this -- it's a warning that there is a possibility that your data could be delivered to other servers in an open, unencrypted manner over the Internet. This is a Bad Thing, but you can't do much except avoid that site, or contact the support or webmaster for the site.
If you're the developer, most of the time you can use a scheme-relative URLs when referencing images or javascript, etc.
i.e. Instead of this:
<img src="http://example.com/dot.png">
use this:
<img src="//example.com/dot.png">
YMMV.
See also: https://url.spec.whatwg.org/
In firefox you can see in Inspect Element=>Network Tab=>Domain Columns.
And also please check in Console tab too.
I hope it will solve your problem.
"Insecure" simply means "not loaded via HTTPS".
This is insecure:
<img class="media-object" src="http://placehold.it/50x50">
This is secure:
<img class="media-object" src="https://placehold.it/50x50">
"Some parts of this page are not secure, such as images."
means not all content are are loading with secure https you can use this online tool to determine which resource is loading with http whynopadlock
This is My Solution
To resolve this issue make sure that the page code does not pull data directly from a non-secure URL.
View the page source html code to check for non-secure items. This can be done in a web browser by doing a right click and selecting 'view source'.
To identify non-secure elements view the source code of the page and search for the text src="http://
This will then highlight elements on your page being loaded from a non-secure URL.
The source code (HTML) needs to be checked for NON SECURE tags. (i.e. http://www.symantec.com/images/seals/Secure...) Ensure the following references are changed to HTTPS or a virtual directory.
Note: The webmaster should always be consulted prior to any adjustments made to a web site.
Thank You and I hope this will Help out
For wordpress users that can't find any 'http:' in the page source check if you have a favicon set. Wordpress will default to their W icon (w-logo-blue.png) and I've had a couple sites continue to serve it from http even after fully converting to ssl.
Dashboard -> Appearance -> Customize -> Site Identity -> add a site icon
FOR IMAGES
First of all, check whether your image file has HTTP instead of HTTPS if so change it to https or rather save those images and put in in the Server.
For instance,
<img src="http://example.com/images/image.jpg">(http image source)
to
<img src="https://example.com/images/image.jpg">(https image source)or into
<img src="//example.com/images/image.jpg">(server image)
Firefox throws an error when you have mixed active content. This is having a combination of HTTP and HTTPs requests; it's a security issue as it leaves room for man in the middle attack- intercepting HTTP content requests with malicious or unwanted requests.
Tip: Check all the following urls in your active content:
< script >
< link >
< iframe >
< XMLHttpRequest >
fetch()
urls in CSS (#font-face,cursor,background.image)
< object >
Navigator.sendBeacon (look for url)
Another tip: make sure to check all files (css gets overlooked)

“The site uses SSL, but Google Chrome has detected insecure content on the page.”

I have just set up SSL on my site https://helloacm.com and the home page is OK but this URL https://helloacm.com/milestones/ browsing in Chrome shows “The site uses SSL, but Google Chrome has detected insecure content on the page.”
I have googled a lot and almost every article says that I should change all http to https for images, css and links.. but I have viewed the source code and found out there are not references to http://helloacm.com any more.. so I don't get it , why this url still shows error.
Look in the console. For me, it says:
Mixed Content: The page at 'https://helloacm.com/milestones/' was loaded over HTTPS, but contains a form whose 'action' attribute is
'http://www.google.co.uk/'. This form should not submit data to
insecure endpoints.
Mixed Content: The page at 'https://helloacm.com/milestones/' was loaded over HTTPS, but requested an insecure image
'http://uploadbeta.com/_s/upload/2014/09/04/1137292dd6fbe2b75f1373cb0e3c7a1c.jpg.jpg'.
This content should also be served over HTTPS.
Mixed Content: The page at 'https://helloacm.com/milestones/' was loaded over HTTPS, but requested an insecure image
'http://uploadbeta.com/_s/upload/2014/09/26/eb174fb4bab9f8cba5ef25fb0321234f.jpg'.
This content should also be served over HTTPS.
Mixed Content: The page at 'https://helloacm.com/milestones/' was loaded over HTTPS, but contains a form whose 'action' attribute is
'http://www.google.com/'. This form should not submit data to insecure
endpoints.
Simply fix the errors here, and that warning will go away. Also, regarding the second error: why are you requesting a .jpg.jpg? For me that simply reduces the quality. Just change that to a .jpg.
Just wanted to throw in another answer here for those of you who have tried everything and are still getting this error message.
With some hosts, like WP Engine, where you have yourwebsite.com but then another version of your site like yourinstall.wpengine.com (MediaTemple has something like this, and probably lots of other hosts), and especially if you built / developed the site at that temporary URL, and then set things up to forward the install to your actual URL...do a check in your database, because depending on how the forwarding works at the server level, you might see https://yourwebsite.com/my-image.png and be baffled, but in the database the actual image being served is still from the temporary domain.
Had me baffled forever!
You must set the "$config_location_base" as https://yoursite.com directive in your config.

Who knows which files should be included in a website?

When the browser requests a website, any website from a HTTP server, which of the two parses the site's content in order to know which other files need to be included on the webpage?
What I mean is this:
the browser asks for the html file and then observers that it needs to import some external css files and HE is the one who requests them.
OR
the HTTP server when faced with a request for a website, parses (already knows) which sites need to be linked to a certain webpage and sends them alongside the html page?
I'm guessing the first case is the correct one, but if someone can confirm and maybe clarify it, I'd appreciate it.
It's all done by the client (which is usually a browser). When it sees <script>, <iframe>, <img>, <link>, etc. tags that reference other documents, it downloads them if necessary.
According to Wikipedia -
The primary function of a web server is to cater web page to the
request of clients using the Hypertext Transfer Protocol (HTTP). This
means delivery of HTML documents and any additional content that may
be included by a document, such as images, style sheets and scripts.
and
The primary purpose of a web browser is to bring information resources
to the user ("retrieval" or "fetching"), allowing them to view the
information ("display", "rendering"), and then access other
information ("navigation", "following links").
It is the Browser that parses the HTML and request for the associated contents.

SSL certificate warning in asp site

I have an ASP web site that give a warning to visitors with red x (in chrome) and FireFox not verified when they try to login. see the picture
Please advise what it means and what I should do
thanks
When a page is loaded via an HTTPS URL, the browser security model states that all resources referenced by that page should also be HTTPS URLs. Check your page for references to JavaScript, CSS, JPGs, etc. All of them should be using HTTPS when the main page is loaded by HTTPS.
If you have JavaScript that is dynamically loading content with XHR, you need to make sure the URLs you load match the scheme (HTTP or HTTPS) of the main page. This is particularly important for JavaScript that is intended to be reused on multiple HTML pages, some which are loaded via HTTP and some with are loaded via HTTPS.

Why do I have both HTTPS and HTTP links on site, need them all secure!

I am getting the security alert: "You are about to be directed to a connection that is not secure. the information you are sending to the current site might be transmitted to a non-secure site. Do you wish to continue?" when I try to login as a customer on my clients oscommerce website. I noticed the link in the status bar goes from a https prefix to a nonsecure http prefix. The site has a SSL certificate, so how do I ensure the entire store portion of the site directs to the secured site?
It is likely that some parts of the page, most often images or scripts, are loaded non-secure. You'll need to go through them in the browser's "view page source" view one by one and eliminate the reason (most often, a configuration setting pointing to http://).
Some external tools like Google Analytics that you may be embedding on your site can be included through https://, some don't. In that case, you may have to remove those tools from your secure site.
If you can't switch all the settings, try using relative paths
<img src="/images/shop/xyz.gif">
but the first thing is to identify the non-secure elements using the source code view of your browser.
An immediate redirection from a https:// page to a http:/ one would not result in a warning as you describe. Can you specify what's up with that?
Use Fiddler and browse your site, in the listing it should become evident what is using HTTP and HTTPS.
Ensure that the following are included over https:
css files
js files
embedded media (images, videos)
If you're confident none of your own stuff is included over http, check things like tracking pixels and other third-party gadgets.
Edit: Now that you've linked your page, I see that your <base> tag is the problem:
<base href="http://balancedecosolutions.com/products//catalog/">
Change to:
<base href="https://balancedecosolutions.com/products//catalog/">
If the suggestion from Pekka doesn't suit your needs you can try using relative links based on the schema (http or https):
e.g.,
I am a 100% valid link!
The only problem with this technique is that it doesn't work with CSS files in all browsers; though it does work within Javascript and inline CSS. (I could be wrong here; anyone want to check?).
e.g., the following :
<link rel="stylesheet" href="/css/mycss.css" />
<!-- mycss.css contents: -->
...
body{
background-image:url(//static.example.com/background.png);
}
...
...might fail.
A simple Find/Replace on your source code could be easy.
It sounds to me like the HTML form you are submitting is hardcoded to post to a non-secure page.