Generating Google Docs from a Flutter App with Google Apps Script API

  • Feb 02, 2024

In today's digital world, businesses and developers often find the need to automate document generation for various purposes. In this blog post, we will explore how to use the Google Apps Script API to generate Google Docs from a Flutter app. This solution can be valuable for automating the creation of reports, documents, or any content you need to generate programmatically.

Introduction

The Google Apps Script platform is a powerful cloud-based scripting tool. With it, you can automate tasks and build custom solutions for various Google Workspace (formerly G Suite) applications, such as Google Docs, Google Sheets, and Google Drive. Using Google Apps Script, you can create, manipulate, and manage Google Workspace applications.

1. JavaScript-Based: Google Apps Script uses JavaScript as its scripting language, which is widely known and used by developers.

2. Cloud-Based: Google Apps Script is cloud-based, so it doesn't require any server infrastructure or maintenance.

3. Web Apps: Scripts can be deployed as web apps that can be accessed through HTTP requests using Apps Script. Using this feature, you can create APIs for external applications, such as your Flutter application.

Creating and Deploying Google Apps Script
Creating a Google Apps Script to generate documents will be the first step before we integrate with Flutter.

Creating Google Apps Script

  • 1. Open Google Drive: Go to Google Drive and click on the "+ New" button. From the dropdown menu, select "More," then choose "Google Apps Script."

  • Write Your Script: In the Google Apps Script editor, you can write your script to generate Google Docs. Below is a simple example of a Google Apps Script function that creates a Google Doc with static data:



function createDocument() {

 var data = [
     {
       "name":"jack",
       "profile_photo":"https://picsum.photos/200"
     },
     {
       "name":"john",
       "profile_photo""https://picsum.photos/201",
     }
 ];
 // Create a new Google Doc titled 'User Document'
 var doc = DocumentApp.create('User Document');
 var body = doc.getBody();

 //Add a heading to the document
 body.appendParagraph('User Data Table');
 // Create a new table with 2 columns
 var table = body.appendTable();
 var tableRow = table.appendTableRow();
 tableRow.appendTableCell('Name');
 tableRow.appendTableCell('Profile Photo');
 for (var i = 0; i < data.length; i++) {
   var name = data[i].name;
   var profilePhotoUrl = data[i].profile_photo;
  // Add a new row for each user
   var tableRow = table.appendTableRow();
   tableRow.appendTableCell(name);
   // Insert an image in the second cell
   var cell = tableRow.appendTableCell();
   var imageBlob = UrlFetchApp.fetch(profilePhotoUrl).getBlob();
   var image = cell.appendImage(imageBlob);
   image.setWidth(100);
   image.setHeight(100);
 }
 // Return the ID of the created document
 return doc.getId();
}
function doGet() {
 var documentId = createDocument();
 return ContentService.createTextOutput(documentId);
}



Deploy as a Web App:

In the script editor, click on deploy button and select new deployment. After that click on the settings icon and select the web app.

Choose “Anyone” and click on the deploy button.

Select the unsafe option and accept the necessary permissions. After successful deployment, you will be provided with a URL. This is the endpoint for your web app.

Integration with Flutter

By using the http package in your Flutter app, you can make an HTTP request to the deployed web app URL. As part of the response, you will receive the ID of the generated Google Doc, which you can use in your app as needed.

Future<void> generateGoogleDoc() async {
  final apiUrl = 'YOUR_DEPLOYED_WEB_APP_URL';

  final response = await http.get(Uri.parse(apiUrl));

  if (response.statusCode == 200) {
    final documentId = response.body.replaceAll('"''');
    String documentUrl =              'https://docs.google.com/document/d/$documentId/edit';
    // Handle the generated document ID as needed
  } else {
    // Handle error
  }
}




Conclusion

In this example, we explored how to dynamically generate a Google Doc with user data and images using Google Apps Script. As a web app, the script can be accessed via HTTP requests, making it easy to integrate with external applications like Flutter.

Feel free to adapt this example to your specific use case, and explore the possibilities of automating document generation for your projects.

If you have any questions or comments, please share them on queries@techcolline.com . Happy coding!

Copyright @2024 TECHCOLLINE