Uploading to Google Cloud via an asp.net webpage - javascript

I have a webpage through which my users, using a mobile phone, can take pictures and upload them (hopefully) to the Google Cloud (I've got a JSON file, a platform project and an associated storage bucket, as well as all the login details).
However, I'm pretty new to all this and need to know how I'd get the file (coming from a standard <input file="" name="fileupload"/> ) to the Google Cloud space, and also to retrieve the URI of the file. Given that it's an asp.net webpage, I have access to Javascript and C#.
Thanks!

I have a couple of suggestions for you. We have other customers that have solutions which are similar to this architecture and so your proposed solution is good.
Google Cloud Storage (GCS) has a feature called Signed URLs. This allows you to generate a secure URL to an object in a GCS bucket. My colleague wrote the C# sample for this:
https://cloud.google.com/storage/docs/access-control#signing-code-csharp
There's a method in here that you can reuse GetSigningURL.
Each time a user requests the web page, you should generate a Signed URL and use this as the destination URL for the file upload location in your HTML.
If your HTML is generated by ASP.NET (MVC, Web Forms, Web Page), then you can make the call to GetSigningURL when the page is generated server-side. If not, you should wrap the C# code in a Web API and then you could use, e.g. jQuery ($.ajax), to call it from your client.
You may run your ASP.NET code on Google Cloud Platform using either Windows on Google Compute Engine or using Custom Runtimes on Google App Engine.
Full disclosure: I'm a Googler working in cloud as a Strategic Customer Engineer.

Related

Google Calendar API key embedded in JS?

I'm writing an app in JS that fetches Google Calendar events using Google Calendar API. I've already generated an API Key and Client ID - do I have to do something to try and 'secure' them? Their tutorial puts them directly in the JS file (https://developers.google.com/calendar/quickstart/js), but then I dig further into the dev docs (https://cloud.google.com/docs/authentication/api-keys#securing_an_api_key) and it says not to embed the API key into the code...but that could just be for paid API keys?
I'm writing this mini webapp for a class so I only need it to work for like 6 weeks. I'm hosting it via GitHub Pages, and it was the one that alerted me about the API Key when I pushed the code.
Bottom line - is it safe for me to embed the API key into the JS code that gets pushed to github and made publicly available (so I can have just a frontend and use GitHub Pages)? Or do I need to take some kind of preventative measures?
Thanks in advance!
Api key is only used for accessing public data. For example you could use it to access the Google Calendar public holiday calendars. That being said yes you should keep your api key secrete and not share it but google is aware that this is not possible with client side languages like JavaScript so i have never heard of anyone getting in trouble for leaking their api key by having it in a JavaScript application.
This warning is mainly means that you should not put it in a GitHub open source repository that anyone can download and then run. You must instruct people how to create their own.
That being said if you are trying to access private user data then you should be using Oauth2 to authenticate your users and this you can lock down to only your domain due to the need for a redirect uri. As you say you have created a client id i suspect that you have already done that. Apikey in the javascript code isnt strictly needed if you have added the client id for oauth2.

Publishing data from an array to a google spread sheet

I am working on a project where I run a web page from a local server using Xampp. In the web page I have a button which when clicked produces an array of 24 elements. I want this array to be written to my online google sheet.
My Question:
1)Can I post data from a web page running on a local server like Xampp to an online server like google sheet?
2)If yes, then is it possible to do it with php and javascript without any jquery?
3)If it is possible please show me the right path.
I am new to web development. Please help me. Thank you in advance for helping.
Yes it is possible to post data from your localhost as long as you have an internet connection.
to do such things I recommend you to read Sheets API Guides
You will also find there a sample code to write data to a spreadsheet on this page
Still an API key is required for public spreadsheets for other requests you need to use OAuth 2.0 as told here
If the request requires authorization (such as a request for an individual's private data), then the application must provide an OAuth
2.0 token with the request. The application may also provide the API key, but it doesn't have to.
If the request doesn't require authorization (such as a request for public data), then the application must provide either the API key
or an OAuth 2.0 token, or both—whatever option is most convenient for
you.
also as an advice and if you know javascript you could use Google App Script to get Started, after validating the implementation of the library into your project and console you will find built-in functions.

Use Google Apps Script Execution API with API keys and Javascript

I want to create a web application for my client and use Google drive to store information.
Since it's impossibe to integrate a web application from google apps script in my own website I try to use Google Apps Script Execution API and Javascript to make the interaction between my website and Google Drive.
I find out some exemple like this one :
https://mashe.hawksey.info/2015/10/google-sheets-as-a-database-authenticated-insert-with-apps-script-using-execution-api/
I do be able to reproduce this example but it use an Auth authentification.
I would like to use Google Apps Script Execution API without Auth authentification but with simple API keys.
Is it possible ? And do you have an example to illustrate this.
Thank you for your help,
Yes you can do that. Check this guide about web deployment using apps script. You just need to run the web app as your own user (parameter Execute the app as). But you will only be able to get access to your own google Drive which may not be that useful. If you want to access others' people Drive then you must run the web app as the current user but this will prompt for permissions (the first time the user access your application).

Upload file to my google drive from anyone using javascript

I am new to google api. I am able to do this file upload from app script and any file which is uploaded through that script get stored to my drive only.
But how to do this using javascript.
Example on google : https://developers.google.com/drive/web/quickstart/quickstart-js
shows how to do this but file gets uploaded to the same user's drive who is authorizing the app. How to restrict it to my drive only.
Thanks
Simple answer is you cant with JavaScript. The reason being is that JavaScript works with OAuth2 this requires that you ask the user permission to access your data.
If you want to have it access your drive account you would have to save the refreshtoken some place and then send that when ever the script was loaded. JavaScript is client sided so anyone that checked the code on the page would then have all the information they needed to do what ever they wanted with your drive account. Security wise that's a bad idea.
I recommend you look into using a server sided scripting language like PHP. You might want to consider a service account. Note: everything will be owned by the service account so you will either have to give the Service account access to your Google Drive files or you will need to move your drive files to the Service account.
If you don't want the service account to have the files you could go with normal Oauth2 save the refresh token and then store it in the server sided code there wont be as much of security risk there.

Using a server to send/receive information between a mobile phone and web page

I am trying to set up a simple set up as follows:
Have a mobile app with a page consisting of 4 lines (4 html paragraph lines (I am using phonegap)).
I want to use a web page from which I will input the data for those 4 lines. This information is sent to a server and that server transfers this information to that app on that mobile phone. Now, those 4 lines on the mobile phone is filled with the new information.
Similarly user inputs information on another page consisting of 10 lines of li (list). This information is again sent to the server and to the web page where the information is displayed.
I can almost feel the "internet police guys" getting all hyped and ready to vote this question down. But please understand that I have been on this site and various forums desperate to find a tutorial to guide me to do this and not able to find.
I am trying to use ajax to perform this setup. Confused how I would be using the php file. Information such as password n username is going to go in that php file to connect to the server. But php is a server side script thus needs to sit at the public_html folder. How do I use the php file from my desktop? Write a separate javascript to access it?
It is the concept that is confusing me. I am familiar with html,js,php.
I would appreciate any guidance or maybe a link to a tutorial which would help me to do the concept I mentioned. Thanks for listening.
You will need to create an API using PHP. This API is uploaded to your server and is considered "RESTful". Google a tutorial for what fits your needs. You can set all sorts of rules in this API such as requiring any requests to have an ID or access token.
Since you are using PhoneGap, your HTML and JS files rest on the device, so you will need to allow permissions to your API from anywhere. For this you will have to speak to your host provider about unless you know how to configure it yourself (some providers restrict what you want to do by default as an extra security precaution against XSS attacks).
Next, you can either use jQuery, or you can write some AJAX calls by writing the JavaScript yourself.
The most efficient way for this to work is to send JSON objects to and from the API. You will include a "command" in the JSON when you are sending from your app. On the PHP side, you will retrieve this command and use the rest of the data included in your JSON object to process the request. Your API will need to encode a JSON object for return (such as a user's profile information).
Here is a basic PHP API tutorial to get you going that explains some of the features of a RESTful API: PHP API
Here is a simple AJAX function (you will probably want to make this much more modular): AJAX
As broad as your question is, it seems like the best/easiest thing for you to do will be for you to first create a PHP webpage that will access a SQL database to perform the record updating. Actually, this should serve all of your needs for your mobile users assuming you don't need push notifications for live data updates.
I am assuming, since you are using phone gap, that you are more comfortable with web languages. After you get the webpage fully operational, then you should start building your app based on that exact same SQL database. With mobile app development there are a lot more "what if's" (what if the phone rings, what if the app is running in the background, what if there is no cellular service, etc...)
It is always easier to start with what you know and build on that, rather than starting with a new development platform and troubleshooting as problems arise.

Categories

Resources