I am trying to create a website to upload a file to Google Drive from my website, but I have had a lot of trouble.
I have used this code:
<!DOCTYPE html>
<html>
<head>
<title>Save to Drive Demo: Explicit Render</title>
<link rel="canonical" href="http://samrobbins.125mb.com/googledrive.html">
<script src="https://apis.google.com/js/platform.js">
{parsetags: 'explicit'}
</script>
</head>
<body>
Render the Save to Drive button
<div id="savetodrive-div"></div>
<script>
function renderSaveToDrive() {
gapi.savetodrive.render('savetodrive-div', {
src: 'http://samrobbins.125mb.com/knowledgebase.py',
filename: 'Cat.py',
sitename: 'The electronic cat database'
});
}
document.getElementById('render-link').addEventListener('click', renderSaveToDrive);
</script>
</body>
</html>
But when I load it, it says there is Failed Upload HTTP error (6)
Is there any way to stop this?
http error 6 is could not resolve host name. Your server may be down or the data-src server may be down. Try later.
You are sharing from a google drive. the default visibility of a google drive doc is private. You should change this to public.
Check the box next to a file/folder and click the Share button at the top of your file list
Related
I am developing a web app on App Script (to use Google APIs). I have a chrome extension that works alongside the web app so that I can send information about the browser.
I am using a content script that initializes once the Web App loads. I want to simply send a message from the extension to the web app through the content script. However, DOM doesn't work because App Script uses iFrames. Here is the code from my actual web app:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<input type="text" id="pageId" onchange="updateSessionInfo()">
</body>
<script>
function updateSessionInfo(){
var pageId = document.getElementById("pageId").value;
google.script.run.update(pageId);
}
</script>
</html>
I was trying to use DOM to send the pageId to the input element and by having a change in the value, the update function would send the information.
However, this is the structure I receive on my browser:
Chrome Dev Tools
Am I thinking correctly? Or is editing the DOM both dirty and unfeasible? Is there another way?
UPDATE:
I have found the actual document HTML elements by looking deeper down the tree:
New Console
But if the element with id="pageId" is down there, why does it return null when I call it?
UPDATE:
I noticed times when it returns null, and sometimes where the element is detected:
Newest Console
This works for me as a dialog:
Typically I would expect that if this will run as a dialog it will also run as a webapp with the addition of a doget();
gs:
function runmydialog() {
const ui = SpreadsheetApp.getUi();
ui.showModelessDialog(HtmlService.createHtmlOutputFromFile('ah2'),'test');
}
function update(msg) {
SpreadsheetApp.getUi().alert(msg);
}
html:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<body>
<input type="text" id="pageId" onchange="updateSessionInfo()">
<script>
function updateSessionInfo(){
var pageId = document.getElementById("pageId").value;
google.script.run.update(pageId);
}
</script>
</body>
</html>
Dialog:
Alert:
I noticed that your script is not inside the body. I don't know if that makes a difference.
So I am working on a project for my rPi which collects network speed information and logs it in a webserver locally. The Script is working all fine, but for some reason the JQuery code runs differently in Windows (where it read a file and displayed correctly) as in my rpi. Let me explain: The file is modified every so often to change what is displayed in the webserver so it is up-to-date. For some reason, without modifying anything, the JQuery code reads the file incorrectly (old data after changing the file, even after restarting the whole program). I have even tried to move the file out of the dir it was in, to verify that there wasn't any other duplicate file, and there wasn't another.
This is the HTML file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script src='jquery-3.6.0.min.js'></script>
<script>
$.get('./assets/current.txt', function(data) {
var items = data.split(',');
$('#date').html(items[0]);
$('#ping').html(items[1]);
$('#download').html(items[2]);
$('#upload').html(items[3]);
})
</script>
<p>Date: <span id="date"></span></p>
<p>ping: <span id="ping"></span> ms</p>
<p>dowload: <span id="download"></span> MB/s</p>
<p>upload: <span id="upload"></span> MB/s</p>
</body>
</html>
This behaviour is possible if browser is caching the file. In order to force the file from server all the time extend the url as $.get('./assets/current.txt?_u='+Date.now(), function (){...})
I created an Google login button:
<!DOCTYPE html>
<html>
<head>
<title>Google Auth Demo</title>
<meta name="google-signin-client_id" content="xxxx.apps.googleusercontent.com">
<script src="https://apis.google.com/js/platform.js" async defer></script>
<script>
function signOut() {
gapi.auth2.getAuthInstance().signOut().then(function() {
console.log('user signed out')
})};
function onSignIn(googleUser) {
console.log(googleUser.getBasicProfile());
}
</script>
</head>
<body>
<h1>Welcome to the Demo</h1>
<div class="g-signin2" data-onsuccess="onSignIn" data-ux_mode="redirect" ></div>
<button onclick="signOut()" >Sign out</button>
</body>
</html>
I changed a param from popup to data-ux_mode="redirect". How do I configure the field Authorized redirect URIs or change somethingelse for my app on https://console.developer.google so I can use it on localhost?
I had find a close issues here: https://github.com/google/google-api-javascript-client/issues/288#issuecomment-289064472 . So it's availabe for implement code authen button Google sample without open popup?
You need to add authorized domains and redirect URI's to your client ID or API keys using this URL
https://console.cloud.google.com/apis/credentials?project={YOUR-GOOGLE-CLOUD-PROJECT-NAME}
Basically in the GCP console, on the left navigation bar go to APIs and Services. Over there look for the oAuth2.0 client ID you are using in your project. Once you click on it you have an interface to configure Authorized redirect URIs and Authorized JavaScript origins
Edit: upon going through the linked github issue(which is still open by the way) it is not possible to get the token to a local machine using the redirect UX. They have plans to support it in the future but currently only works with popup method.
Hi #Jeevsxp, this is not possible to obtain an authorization code
without popup. This is a security restriction: an offline code will
allow you to obtain a refresh_token in the server, that gives you the
possibility to obtain a fresh access_token anytime you want. For that,
the user needs explicit consent
I've cloned the PerfectTemplate project and am using it to serve up html as follows…
import PerfectHTTP
import PerfectHTTPServer
var routes = Routes()
routes.add(method: .get, uri: "/test") { request, response in
response.addHeader(.contentType, value: "text/html")
response.setBody(string: """
<!DOCTYPE html>
<html lang="en">
<head>
<title>Test!</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="Welcome">Hello</div>
</body>
</html>
""")
response.completed()
}
routes.add(method: .get,
uri: "/**",
handler: StaticFileHandler(documentRoot: "./webroot", allowResponseFilters: true).handleRequest)
try HTTPServer.launch(name: "localhost",
port: 8181,
routes: routes,
responseFilters: [(PerfectHTTPServer.HTTPFilter.contentCompression(data: [:]), HTTPFilterPriority.high)])
I'm compiling and running with Xcode, and http://localhost:8181/test is returning the html as expected.
The problem is the location of the external css file. As far as I can tell this should be in a folder called webroot, but where should that folder be when running locally?
For reference, I'm coming at this as an iOS dev, so my knowledge of web development and server config is limited.
Update
Per a suggestion on the Perfect Slack group, I added the css file to the project folder (the same folder as Package.swift), and set the Working Directory of the scheme $(PROJECT_DIR) - but I’m getting a 404 trying to load http://localhost:8181/style.css
With help from the Perfect Slack group, I found a solution. The missing piece for me was the webroot folder. I'd assumed this was some kind of alias, but it turns out that you do need to create an actual folder called webroot. So…
Set the Working Directory of the scheme to $(PROJECT_DIR)
In the project folder, create a folder named webroot and add the css file to that folder. It should look like this…
I'm sure all the seasoned web devs are laughing at me right now!
I'm just learning google script and want to start by making a simple hello world. I have done google's tutorial and when I click "test this code" on the publish web app popup, the code runs and I get my basic hello world result. Great. But When I paste the provided URL into the browser or embed that same URL into google sites, I just get a blank page.
How do I run an web app? Am I missing something?
code.gs:
function doGet() {
var html= HtmlService
.createTemplateFromFile('Index');
html.name = 'David';
return html.evaluate();
}
index.html:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<b>Hi <?=name?>!</b>
</body>
</html>
Coming from a basic PHP background, I'm used to just going to the URL of the .php file and bang, away it goes... I'm so confused.
https://stackoverflow.com/a/40843413/6288442
Google had just recently enabled this feature. It has been under a
'feature request' status for quite a long time. Link here
You can now explicitly define X-Frame-Options.
To allow embedding under another domain, the option should be
HtmlService.XFrameOptionsMode.ALLOWALL
Google documentation on the subject:
https://developers.google.com/apps-script/reference/html/html-output#setXFrameOptionsMode(XFrameOptionsMode)
Example:
function doGet() {
return HtmlService.createTemplateFromFile('form.html')
.evaluate() // evaluate MUST come before setting the Sandbox mode
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL); }
Hope this helps!
I think this should work
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<b>Hi <?!=name?></b>
</body>
</html>
https://developers.google.com/apps-script/guides/html/templates#force-printing_scriptlets
Name of file should also be exactly same
I think Index and index won't work