google-cloud-platformmarkdowngoogle-cloud-shellwalkthrough

How to specify image path in cloud shell when writing GCP walkthrough tutorial?


I am Writing Walkthroughs in Cloud Shell and I want to include an image there with

#title
## section 
some text
![myimage](./myimage.PNG)

The image is in the same directory as my index.md:

.  
├── myfolder  
│   ├── index.md  
│   └── myimage.PNG  
└── README.md 

But although the image is displayed in the preview in the editor, it does not show up when I am launching the tutorial from the cloud shell with cloudshell launch-tutorial index.md. What however does work is uploading the image to cloud storage and referencing it via its URL

![myimage](https://storage.cloud.google.com/mybucket/myimage.PNG)

But how would I achieve the same using the cloud shell file system?


Solution

  • Notice that Walktroughs are written to abide the CommonMark Spec.

    I don't think there would be any other way than to reference the URL of the file, and showing local files is not supported. So uploading the file to Cloud Storage (or any other Blob Storage platform from where you could get a public URL for your image) and making the object publicly readable is in fact the correct approach to add the images to your .md file.

    I tried all of the different specifications referencing local files as mentioned here, all the alternatives shown on this other post, as well as even try to display it as Base64 without any success (even though as you reporfrom thet you'll be able to see the image successfully when viewing the preview from the Cloud Shell's Editor), as you'll get a 404 error message when trying to display the image referencing a local file (even if you type in the full path).