sync: fix cors for storage api (#263)

apps/readest-app/src-tauri/tauri.conf.json

@@ -15,7 +15,7 @@
     "security": {
       "csp": {
         "default-src": "'self' 'unsafe-inline' blob: customprotocol: asset: http://asset.localhost ipc: http://ipc.localhost",
-        "connect-src": "'self' blob: asset: http://asset.localhost ipc: http://ipc.localhost https://*.sentry.io https://*.posthog.com https://*.deepl.com https://*.wikipedia.org https://*.wiktionary.org https://*.supabase.co https://*.readest.com wss://speech.platform.bing.com",
+        "connect-src": "'self' blob: asset: http://asset.localhost ipc: http://ipc.localhost https://*.sentry.io https://*.posthog.com https://*.deepl.com https://*.wikipedia.org https://*.wiktionary.org https://*.supabase.co https://*.readest.com wss://speech.platform.bing.com https://*.cloudflarestorage.com",
         "img-src": "'self' blob: data: asset: http://asset.localhost https://*",
         "style-src": "'self' 'unsafe-inline' blob: asset: http://asset.localhost https://cdn.jsdelivr.net",
         "font-src": "'self' data: asset: http://asset.localhost tauri: https://fonts.gstatic.com https://db.onlinewebfonts.com https://cdn.jsdelivr.net",

apps/readest-app/src/app/library/components/SettingsMenu.tsx

@@ -50,6 +50,11 @@ const SettingsMenu: React.FC<BookMenuProps> = ({ setIsDropdownOpen }) => {
     setIsDropdownOpen?.(false);
   };
 
+  const handleReloadPage = () => {
+    window.location.reload();
+    setIsDropdownOpen?.(false);
+  };
+
   useEffect(() => {
     if (!user || !token) return;
     const storagPlan = getStoragePlanData(token);
@@ -108,6 +113,8 @@ const SettingsMenu: React.FC<BookMenuProps> = ({ setIsDropdownOpen }) => {
         <MenuItem label={_('Sign In')} icon={<PiUserCircle />} onClick={handleUserLogin}></MenuItem>
       )}
       <hr className='border-base-200 my-1' />
+      <MenuItem label={_('Reload Page')} onClick={handleReloadPage} />
+      <hr className='border-base-200 my-1' />
       {isWebApp && <MenuItem label={_('Download Readest')} onClick={downloadReadest} />}
       <MenuItem label={_('About Readest')} onClick={showAboutReadest} />
     </div>

apps/readest-app/src/pages/api/storage/delete.ts

@@ -6,12 +6,12 @@ import { DeleteObjectCommand } from '@aws-sdk/client-s3';
 import { s3Client } from '@/utils/s3';
 
 export default async function handler(req: NextApiRequest, res: NextApiResponse) {
+  await runMiddleware(req, res, corsAllMethods);
+
   if (req.method !== 'DELETE') {
     return res.status(405).json({ error: 'Method not allowed' });
   }
 
-  await runMiddleware(req, res, corsAllMethods);
-
   try {
     const { user, token } = await validateUserAndToken(req.headers['authorization']);
     if (!user || !token) {

apps/readest-app/src/pages/api/storage/download.ts

@@ -19,12 +19,12 @@ const getUserAndToken = async (authHeader: string | undefined) => {
 };
 
 export default async function handler(req: NextApiRequest, res: NextApiResponse) {
+  await runMiddleware(req, res, corsAllMethods);
+
   if (req.method !== 'GET') {
     return res.status(405).json({ error: 'Method not allowed' });
   }
 
-  await runMiddleware(req, res, corsAllMethods);
-
   try {
     const { user, token } = await getUserAndToken(req.headers['authorization']);
     if (!user || !token) {

apps/readest-app/src/pages/api/storage/upload.ts

@@ -20,12 +20,12 @@ const getUserAndToken = async (authHeader: string | undefined) => {
 };
 
 export default async function handler(req: NextApiRequest, res: NextApiResponse) {
+  await runMiddleware(req, res, corsAllMethods);
+
   if (req.method !== 'POST') {
     return res.status(405).json({ error: 'Method not allowed' });
   }
 
-  await runMiddleware(req, res, corsAllMethods);
-
   try {
     const { user, token } = await getUserAndToken(req.headers['authorization']);
     if (!user || !token) {

apps/readest-app/src/services/appService.ts

@@ -247,6 +247,9 @@ export abstract class BaseAppService implements AppService {
         console.log('Downloading file:', fp);
         const cfp = `${CLOUD_BOOKS_SUBDIR}/${fp}`;
         const fileobj = (await downloadFile(cfp)) as Blob;
+        if (!(await this.fs.exists(getDir(book), 'Books'))) {
+          await this.fs.createDir(getDir(book), 'Books');
+        }
         await this.fs.writeFile(fp, 'Books', await fileobj.arrayBuffer());
         downloaded = true;
       }

apps/readest-app/src/services/environment.ts

@@ -21,7 +21,7 @@ export const isPWA = () => window.matchMedia('(display-mode: standalone)').match
 export const getAPIBaseUrl = () =>
   process.env['NODE_ENV'] === 'development' && isWebAppPlatform()
     ? '/api'
-    : `${READEST_WEB_BASE_URL}/api`;
+    : `${process.env['NEXT_PUBLIC_API_BASE_URL'] ?? READEST_WEB_BASE_URL}/api`;
 
 export interface EnvConfigType {
   getAppService: () => Promise<AppService>;

apps/readest-app/src/utils/cors.ts

@@ -17,5 +17,5 @@ export const runMiddleware = (req: NextApiRequest, res: NextApiResponse, fn: Fun
 };
 
 export const corsAllMethods = Cors({
-  methods: ['POST', 'GET', 'HEAD'],
+  methods: ['POST', 'GET', 'PUT', 'DELETE', 'HEAD', 'OPTIONS'],
 });