Gurpreet Singh
Gurpreet Singh

Reputation: 73

Shopify app is not working in express node js

I am developing a shopify app in express nodejs. I have created installation process of app successfully in express nodejs. After app installation, When I have opened the app then I have getting an error of iframe in shopify admin section. Here's the screen shot:-

enter image description here

Also, it said 'Requests to the server have been blocked by an extension'. This issue comes into Google chrome browser. I have also checked in firefox browser. In firefox, it will works fine and shows me two warning that are:- 1. Content Security Policy: Directive ‘child-src’ has been deprecated. Please use directive ‘worker-src’ to control workers, or directive ‘frame-src’ to control frames respectively. 2. Content Security Policy: Ignoring ‘x-frame-options’ because of ‘frame-ancestors’ directive.

Mainly, it is not working on google chrome.

Please help me regarding this.

Thanks !!!

Upvotes: 1

Views: 1238

Answers (2)

Bilal A.Awan
Bilal A.Awan

Reputation: 378

This issue also happens to me and the problem was, I added new scopes for fulfillment but not reinstalled the app.

  1. Reinstalling the app
  2. Manually authenticate the app using window.location.

Shopify tries to authenticate the app every time when you open it but if Shopify finds any new scope within the app which is not present within the store, it gives you this kind of error.

Mostly the authentication happens with following

  1. Store domain
  2. API Key
  3. Scopes(Definition against type of actions)
  4. RedirectURL(where your app will be redirected after successful authentication)

and it looks similar to this

https://${shopDomain}/admin/oauth/authorize?client_id=${apiKey}&scope=${scopes}&redirect_uri=${redirectUri}

Open the above URL within the browser with actual values in the URL

Whenever you open the app, Shopify tries to use the above like to verify each entity provided in the above link.

Upvotes: 0

Raj Kumar
Raj Kumar

Reputation: 793

You need to include app.js provided by shopify if you haven't included it yet.

In your head section of html, add this

<head>
  <script src="https://cdn.shopify.com/s/assets/external/app.js"></script>
  <script type="text/javascript">
    ShopifyApp.init({
      apiKey: 'YOUR_APP_API_KEY',
      shopOrigin: 'https://CURRENT_LOGGED_IN_SHOP.myshopify.com'
    });
  </script>
  ...
</head>

Source

Upvotes: 1

Related Questions