TryGhost / SDK

Tools for working with Ghost's APIs
MIT License
117 stars 76 forks source link

Image upload via admin api #477

Open Hailst0rm1 opened 1 year ago

Hailst0rm1 commented 1 year ago

Issue Summary

I'm writing a plugin uploading images from obsidian to ghost. When running the code bellow it triggers CORS due to the use of axios. See also https://forum.ghost.org/t/cors-using-admin-api-from-electron-app-obsidian/37743/6

To Reproduce

  1. Code bellow and run the plugin. (Ignore if there's a parenthesis missing or something, I went back to try and reconstruct it).

    async function uploadImages(html: string) {
        // Find images that Ghost Upload supports
        let imageRegex = /!*\[\[(.*?)\]\]/g;
        let imagePromises = [];
    
        // Get full-path to images
        let imageDirectory: string;
        let adapter = app.vault.adapter;
        if (adapter instanceof FileSystemAdapter) {
            imageDirectory = adapter.getBasePath(); // Vault directory
            if (settings.screenshotsFolder) {
                imageDirectory = `${imageDirectory}${settings.screenshotsFolder}`;
            }
            if (frontmatter.imageDirectory) { // Extends the image directory
                imageDirectory = `${imageDirectory}${frontmatter.imageDirectory}`;
            }
        }
        console.log("Image Directory", imageDirectory);
        let result: RegExpExecArray | null; // Declare the 'result' variable
    
        while((result = imageRegex.exec(html)) !== null) {
            let file = `${imageDirectory}/${result[1]}`;
    
                    // Upload the image, using the original matched filename as a reference
                    imagePromises.push(api.images.upload({
                        ref: file,
                        file: file
                    }));
                }
    
                    return Promise
                        .all(imagePromises)
                        .then(images => {
                            images.forEach(image => html = html.replace(image.ref, image.url));
                            return html;
                        });
                    }
  2. Execute the plugin in obsidian and get the following: Access to XMLHttpRequest at 'http://localhost:2368/ghost/api/v4/admin/images/upload/' from origin 'app://obsidian.md' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Maybe this is more of a feature request than a bug - nevertheless something annoying.

derek-adair commented 1 year ago
  1. Upload via api is interesting feature IMO.
  2. Any way you can provide a link to the actual code my dude?
  3. It's quite clear this is a configuration issue that doesn't have to do with ghost. For starters, you probably shouldn't be pointing obsidian to localhost. You need to set up CORS for this. Poke around the interwebs for setting this up for your specific server you have that is serving Ghost.