SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON

rushikesh93 · ‎04-05-2023

Hello, I'm developing Shopify App using ReactJs + PHP (Laravel),

I have created Route in web.php to get csrf_token in my component.

/web/routes/web.php

Route::get('/token', function (Request $request) {
$token = $request->session()->token();
$token = csrf_token();return response()->json(['token' => $token])->header('Content-Type', 'application/json');
});

and this route value I get into a component file using the below code

web/frontend/components/component.jsx

 try {
      const response = await fetch('/token', {
          method: 'GET',
          headers: {
            'Content-Type': 'application/json',
            'X-Requested-With': 'XMLHttpRequest'
          },

        }); 
      const jsonData = await response.json();
       console.log('CSRF token:', jsonData.token);
    }catch (error) {
      console.error(error);
    };

but when I clicked on the button I got an error like

SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON

and in Inspect element in Network Tab, I checked the Response of Router is,

<!DOCTYPE html>
<html lang="en">
  <head>
    <script type="module" src="/@vite/client"></script>
    <script type="module">
import RefreshRuntime from "/@react-refresh"
RefreshRuntime.injectIntoGlobalHook(window)
window.$RefreshReg$ = () => {}
window.$RefreshSig$ = () => (type) => type
window.__vite_plugin_react_preamble_installed__ = true
</script>

    <meta charset="UTF-8" />

    <!-- Ensures that the UI is properly scaled in the Shopify Mobile app -->
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <script type="module" src="/index.html?html-proxy&index=0.js"></script>
  </head>
  <body>
    <div id="app"><!--index.jsx injects App.jsx here--></div>
    <script type="module" src="/index.jsx"></script>
  </body>
</html>

JSON response does not come in json format.

Please help me with this how can I fix this issue?

Thanks

Shopify Beginner.

rushikesh93 · ‎04-06-2023

Please help me with this issue Developers.

Shopify Beginner.

rushikesh93 · ‎04-10-2023

here I have searched in my app, and I found something like

Missing host query argument

Your app can only load if the URL has a host argument. Please ensure that it is set, or access your app using the Partners Dashboard Test your app feature

how can I fix this issue?

Shopify Beginner.

SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON

SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON

Community Blog Articles