Javascript google transliterate API not served ove

JavaScript google transliterate API is not serving over https. Im getting below mixed content error . Its working over http website, but not working with https. I have tried to invoke the API in all the below ways.

 <script type="text/javascript" src="https://google.com/jsapi">
 <script type="text/javascript" src="http://google.com/jsapi">
 <script type="text/javascript" src="//google.com/jsapi">
 <script type="text/javascript" src="//www.google.com/jsapi">

Error:

Mixed Content: The page at 'https://extranuclear-freque.000webhostapp.com/lang.html' was loaded over HTTPS, but requested an insecure script 'http://www.google.com/inputtools/request?text=gy&ime=transliteration_en_bn&num=5&cp=0&cs=0&ie=utf-8&oe=utf-8&app=jsapi&uv&cb=callbacks._2j46jfkrs'. This request has been blocked; the content must be served over HTTPS.

Please help me out. Thanks

<pre> 
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script type="text/javascript" src="https://www.google.com/jsapi">
    </script>
    <script type="text/javascript">
      google.load("elements", "1", {
            packages: "transliteration"
          });
      function onLoad() {
        var options = {
            sourceLanguage:
                google.elements.transliteration.LanguageCode.ENGLISH,
            destinationLanguage:
                [google.elements.transliteration.LanguageCode.BENGALI],
            shortcutKey: 'ctrl+g',
            transliterationEnabled: true
        };
        var control =
            new google.elements.transliteration.TransliterationControl(options);

        control.makeTransliteratable(['transliterateTextarea']);
      }
      google.setOnLoadCallback(onLoad);
    </script>
  </head>
  <body>
    <textarea id="transliterateTextarea" style="width:600px;height:200px"></textarea>
  </body>
</html> 
</pre>

标签： javascript api jsapi

6条回答

ら.Afraid

2楼-- · 2020-03-19 02:47

I have research on the problem and found that google having hardcore into the translationI.js

for fix this issue you can download that file on to your computer and upload to your own server and change the http://google.com to https://google.com that will solve your problem

0人赞添加讨论(0) 举报

戒情不戒烟

3楼-- · 2020-03-19 02:51

Here is a step by step process:

First, there's a link to API:

<script type="text/javascript" src="https://www.google.com/jsapi">

Second, Visit the API link above and search the contents as given below:

google.loader.ServiceBase = 'https://www.google.com/uds';

Now, this is the important part!

You need to replace the link of google.loader.ServiceBase = 'yourfile.js';

note: yourfile.js is a script created by you.

And to do that - you need to create two separate JavaScript files. Why? because the google.loader.ServiceBase is inside google.com/jsapi

This is the process I did:

step 1: Create two JavaScript files - lets say main.js and extra.js

step 2: save the contents of https://www.google.com/jsapi to main.js

step 3: save the contents of https://www.google.com/uds/api/elements/1.0/7ded0ef8ee68924d96a6f6b19df266a8/transliteration.I.js to extra.js

step 4: In extra.js - find qi="http://www.google.com" and replace with qi="https://www.google.com" - remember http is changed to https and save it.

step 5: Now back to main.js - you have to find the google.loader.ServiceBase = 'https://www.google.com/uds'; and replace with google.loader.ServiceBase = 'extra.js'; and save it.

step 6: Call the javascript - the main.js one to your html.

<script type="text/javascript" src="main.js">

0人赞添加讨论(0) 举报

混吃等死

4楼-- · 2020-03-19 02:51

  var control =
            new google.elements.transliteration.TransliterationControl(options);

        var ids = ["transl1", "transl2"];
        control.makeTransliteratable(ids);


//Add the following line to make it work over https

control.c.qc.t13n.c[3].c.d.keyup[0].ia.F.p = 'https://www.google.com';

0人赞添加讨论(0) 举报

Evening l夕情丶

5楼-- · 2020-03-19 02:56

Extending Min Somai's answer for all those who are facing an issue with the pop up not showing up correctly.

Copy CSS from this link & add it to a file transliteration.css. Add the following line to index.html

<link type="text/css" href="assets/google/js/transliteration.css" rel="stylesheet"/>

This should get you the correct CSS required for showing the transliteration popup.

0人赞添加讨论(0) 举报

地球回转人心会变

6楼-- · 2020-03-19 03:00

I have found one solution to rectify above error,you just have to paste this below line Meta tag while uploading server ..if you find this helpful please let me know so..

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

0人赞添加讨论(0) 举报

Juvenile、少年°

7楼-- · 2020-03-19 03:07

save this (https://www.google.com/uds/api/elements/1.0/7ded0ef8ee68924d96a6f6b19df266a8/transliteration.I.js) file locally

find for "qi="http://www.google.com" then change it to qi="https://www.google.com"

it will work

this is description for prev answer of @Nitin Goyal

0人赞添加讨论(0) 举报

Javascript google transliterate API not served ove

Here is a step by step process:

采纳回答

编辑标签

举报内容

检举类型

检举原因

检举说明(必填)

打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮

付费偷看金额在0.1-10元之间